この質問は古いですが、私は自分のニーズに合うこの問題への回答を得ようと長い間苦労しましたが、簡単に見つけることができませんでした。次の解決策は現在受け入れられている解決策よりもはるかに優れていると思います。おそらく、この質問が最初に提起されたため、angularが機能を追加したためです。
短い答えですが、Module.valueメソッドを使用すると、データをコントローラーコンストラクターに渡すことができます。
ここで私のプランカーを参照してください
モデルオブジェクトを作成し、モジュールのコントローラーに関連付けて、「モデル」という名前で参照します
HTML / JS
<html>
<head>
<script>
var model = {"id": 1, "name":"foo"};
$(document).ready(function(){
var module = angular.module('myApp', []);
module.value('model', model);
module.controller('MyController', ['model', MyController]);
angular.bootstrap(document, ['myApp']);
});
function confirmModelEdited() {
alert("model name: " + model.name + "\nmodel id: " + model.id);
}
</script>
</head>
<body >
<div ng-controller="MyController as controller">
id: {{controller.model.id}} <br>
name: <input ng-model="controller.model.name"/>{{controller.model.name}}
<br><button ng-click="controller.incrementId()">increment ID</button>
<br><button onclick="confirmModelEdited()">confirm model was edited</button>
</div>
</body>
</html>
次に、私のコントローラーのコンストラクターは、同じ識別子「モデル」を持つパラメーターを受け入れ、これにアクセスできます。
コントローラ
function MyController (model) {
this.model = model;
}
MyController.prototype.incrementId = function() {
this.model.id = this.model.id + 1;
}
ノート：
ブートストラップの手動初期化を使用していますを使用しています。これにより、angularに送信する前にモデルを初期化できます。これは、関連するデータのセットアップを待機し、必要に応じてオンデマンドでアプリの角度サブセットのみをコンパイルできるため、既存のコードとはるかにうまく機能します。
plunkerには、JavaScriptで最初に定義され、angularに渡されたモデルオブジェクトの値を警告するボタンを追加しました。これは、angularがモデルオブジェクトを参照していることを確認するために、コピーしてコピーするのではありません。
この行で：
module.controller('MyController', ['model', MyController]);
関数としてインラインで宣言するのではなく、MyControllerオブジェクトをModule.controller関数に渡します。これにより、コントローラオブジェクトをはるかに明確に定義できると思いますが、Angularのドキュメントはインラインで行う傾向があるため、明確にする必要があると思いました。
「$ scope」変数を使用するのではなく、「controller as」構文を使用して、値をMyControllerの「this」プロパティに割り当てています。これは$ scopeを使用してもうまく機能すると思います。コントローラーの割り当ては次のようになります。
module.controller('MyController', ['$scope', 'model', MyController]);
コントローラのコンストラクタには、次のような署名があります。
function MyController ($scope, model) {
なんらかの理由で、このモデルを2番目のモジュールの値としてアタッチし、依存関係としてプライマリモジュールにアタッチすることもできます。
私は彼の解決策が現在受け入れられているものよりもはるかに優れていると信じています
- コントローラに渡されるモデルは実際にはJavaScriptオブジェクトであり、評価される文字列ではありません。これはオブジェクトへの真の参照であり、オブジェクトへの変更は、このモデルオブジェクトへの他の参照に影響します。
- Angularは、受け入れられた回答のng-initの使用は誤用であると述べていますが、このソリューションはそれを行いません。
私が見た他のほとんどすべての例でAngularが機能するように見える方法には、モデルのデータを定義するコントローラーがあり、私には意味がありません。モデルとコントローラーの間に分離はなく、実際には私にMVC。このソリューションにより、コントローラーに渡す完全に独立したモデルオブジェクトを実際に作成できます。また、ng-includeディレクティブを使用する場合は、すべての角度のhtmlを別のファイルに入れて、モデルビューとコントローラーを個別のモジュラーピースに完全に分離できます。