誰かが私にこれらの2つのコードの違いとそれを管理する方法を説明してもらえますか？
これが私のindex.htmlです
<body ng-app="docsIsolateScopeDirective">
<div ng-controller="Controller">
<my-customer info="naomi" ></my-customer>
{{nameUser}}
<my-customer info="igor"></my-customer>
</div>
</body>
これが私のscript.jsです
(function(angular) {
'use strict';
angular.module('docsIsolateScopeDirective', [])
.controller('Controller', ['$scope', function($scope) {
$scope.nameUser = 'naomi';
$scope.naomi = { name: 'Naomi', address: '1600 Amphitheatre' };
$scope.igor = { name: 'Igor', address: '123 Somewhere' };
}])
.directive('myCustomer', function() {
return {
restrict: 'E',
scope: {
customerInfo: '=info'
},
templateUrl: 'my-customer-iso.html'
};
});
})(window.angular);
そして最後に私のmy-customer-iso.html：
Name: {{customerInfo.name}} Address: {{customerInfo.address}}
結果はこれです：
Name: Naomi Address: 1600 Amphitheatre
naomi Name: Igor Address: 123 Somewhere
質問は次のとおりです。スコープ変数（基本的には「naomi」を含む$ scope.nameUser）を使用してマークアップの情報を設定したいと思います。しかし、私が書くとき
<my-customer info={{nameUser}} </my-customer> // or <my-customer info="{{nameUser}}"> </my-customer>
の代わりに
<my-customer info= "naomi"></my-customer>
コードが壊れていて、その理由がわかりません。スコープ変数を文字列のように見なすことはできませんか？ありがとう
編集：私が書いたとしても：
<my-customer info = nameUser> </my-customer>
結果はまだ異なります。エラーは発生しませんが、出力は次のとおりです。
Name: Address:
Name: Igor Address: 123 Somewhere
ですから、コントローラーとディレクティブの間の相互作用について何かが足りないと思います。ここを参照してください：https：//plnkr.co/edit/hbi4whoH3Dj9lDV3vVzZ？p = preview
を<my-customer info={{nameUser}} </my-customer>使用する代わりに<my-customer info="nameUser" </my-customer>。あなたは必要ありません{{ }}
更新：
あなたが何を達成しようとしているのかよくわかりません。あなたの例では、単純な文字列 'naomi'を渡そうとしていますが、ディレクティブは次の構造を持つオブジェクトを想定しています。
customerInfo = {
name: "",
address: ""
};
したがって、それを機能させたい場合は、スコープオブジェクトを次のように表示する必要があります。
$scope.nameUser = { name: 'XXX', address: 'YYY' };
次に、次のようにディレクティブに渡します。
<my-customer info="nameUser" ></my-customer>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加