javascript - AngularJS スコープ プロパティは未定義です

Question

なぜ$scope.orderBy未定義なのですか？それは「テスト」であるべきではありませんか？

http://jsfiddle.net/XB4QA/4/

var app = angular.module("Foo", []);

app.directive("two", function () {
return {
    scope: {
        orderBy: '@'
    },
    restrict: 'E',
    transclude: true,
    controller: function ($scope, $element, $attrs) {
        console.log($scope.orderBy); // is undefined, why?   
    },
    template: '<div></div>',
    replace: true
};
});

<div ng-app="Foo">
    <two order-by="test">test</two>
</div>

Answer 1

文字列補間を使用したい場合 (これは の使用に当てはまるようです) 、現在受け入れられている回答のコメントで Ajay が述べた @ように使用する必要があります。$observe

または、orderBy属性が常にリテラル文字列である場合は、空の分離スコープを作成し、バインドを試行しないでくださいorderBy。$attrs.orderBy次に、文字列値を取得するために使用できます。

これはうまくいきます。

app.directive("two", function () {
  return {
    scope: {
      orderBy: '@'
    },
    restrict: 'E',
    transclude: true,
    controller: function ($scope, $element, $attrs) {
      $attrs.$observe('orderBy', function() {
        console.log($scope.orderBy);
      });
    },
    template: '<div></div>',
    replace: true
  };
});

これもそうです：

app.directive("two", function () {
  return {
    scope: {
    },
    restrict: 'E',
    transclude: true,
    controller: function ($scope, $element, $attrs) {
      console.log($attrs.orderBy);
    },
    template: '<div></div>',
    replace: true
  };
});