AngularJS：指令中的隔离作用域

我想编写一个AngularJS指令，并将范围属性控制器范围绑定到模板元素。 我的指令有一个单独的作用域。 它不起作用。谁能帮帮我吗

问候,， 艾格尼丝

下面是我的代码：

JavaScript:

Html:

< hello world name=John Smith name2=val> 结果是： a约翰·史密斯ab未定义b

预期结果是：

---

a约翰·史密斯ab海伦娜·帕克b

如果你想知道它的属性是什么

scope.$watch(function() { return attrs.name2}, function(value) {
    lElement.text(lElement.text() + 'b ' + value + ' b');
});

但最好的方法很简单，就是用双向宾果绑定它

scope: {
  name: "@",
  val: "@"
  name2: "=?"
}

然后

scope.$watch('name2', function(value) {
    lElement.text(lElement.text() + 'b ' + value + ' b');
});

---

我做到了，得到了我想要的约翰·史密斯ab海伦娜·帕克b

JavaScript:

Html:

<

---

hello world name=John Smith val=val>

对于范围对象中的值，您应该使用=而不是@。 此外，对于您的作用域，请定义name2而不是val。或者将val链接到name2属性，我不明白您为什么在val上使用$watch，数据绑定起到了作用，所以请这样做

app.directive("helloWorld", function() {
 return {
   restrict: "E",
   scope: {
     name: "=",
     val: "=name2"
   },
   template: "<div>a {{name}} a b {{val}} b </div>",
   link: function linkFn(scope, lElement, attrs) {

    }
 };
});

---

attrs.name2不在作用域中，因此作用域没有任何可监视的内容？

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.val = "Helena Parker";
});

app.directive("helloWorld", function() {
  return {
    restrict: "E",
    scope: {
      name: "@",
      val: "="
    },
    template: "<div>a {{name}} ab {{val}} b</div>"
  };
});

app.directive("helloWorld", function() {
 return {
   restrict: "E",
   scope: {
     name: "=",
     val: "=name2"
   },
   template: "<div>a {{name}} a b {{val}} b </div>",
   link: function linkFn(scope, lElement, attrs) {

    }
 };
});