javascript - Angular 在自定义指令中设置新变量

Question

我正在学习 Angular 类(class)，作为一个完全的新手，我有一个关于自定义指令的新手问题要问。我想知道我们如何在该自定义指令中设置新变量并在我们的 View 中访问它们，如果有人可以清楚地解释这一点，这是否可能？

例如:

myApp.controller('mainController', ['$scope', '$log', function($scope, $log) {

$scope.person = {
    name: 'John Doe',
    address: '555 Main St., New York, NY 11111'
}

}]);

myApp.directive("searchResult", function() {
return {
   restrict: 'AECM',
   templateUrl: 'directives/searchresult.html',
   replace: true,
   scope: {
       personName: "@",
       personAddress: "@",
       newVariable: "someValue"
   }
 }
});

搜索结果.html

<a href="#" class="list-group-item">
<h4 class="list-group-item-heading">{{ personName }}</h4>
<p class="list-group-item-text">
    {{ personAddress }}
</p>
<p class="list-group-item-text">
    {{ newVariable }}
</p>

main.html

<label>Search</label>
<input type="text" value="Doe" />
 <h3>Search Results</h3>
<div class="list-group">
<search-result person-name="{{ person.name }}" person-address="{{ person.address }}" newVariable="{}"></search-result>

Answer 1

对本地范围使用链接函数

myApp.directive("searchResult", function() {
return {
   restrict: 'AECM',
   templateUrl: 'directives/searchresult.html',
   replace: true,
   scope: {
       personName: "@",
       personAddress: "@"
   },
   link: function(scope, elem, attr) { scope.newVariable='something'; },
 };
});