Angularjs:如何在指令中读取对象

Question

我已经将一个对象从 Controller 传递给指令，但是当我在指令中读取对象时我无法读取，指令对象似乎被读取为字符串。代码在下面，我想从中读取城市和州对象。

Html File

<div ng-controller="WeatherController">    
<div weather ng-object="{{Object}}"></div>
</div>

Controller
.controller('WeatherController', ['$scope', function ($scope) {
   $scope.webpartData.OverviewData.Person.Address.City;
            $scope.Object = {
                City: '',
                State: ''
            };
            $scope.Object.City = 'TestCity';
            $scope.Object.State = 'TestState';         
        });
    })
}])


Directive


angular.module('WeatherModule', [])
.directive('Weather', ["$timeout", function($timeout) {
    return {
        restrict: 'EA',
        template: '<div id="weather"></div>',
        scope: {
            ngObject: '@ngObject'
        },
        link: function(scope, element, attrs) {
            scope.$watch('ngObject', function(value) {
                scope.ngObject = value;
            });
            $timeout(function() {
                console.log('Location' + scope.Object.City + ',' + scope.Object.State);
            }, 100);
        }
    };
}])

Answer 1

在引用指令范围成员时，@、= 和 & 之间存在差异。

 1. "@"   (Text binding / one-way binding)
 2. "="   (Direct model binding / two-way binding)
 3. "&"   (Behaviour binding / Method binding)

@ 表示 Controller 范围内的更改将反射(reflect)在指令范围内，但如果您修改指令范围内的值， Controller 范围变量不会受到影响强>.

@ 总是期望映射的属性是一个表达式。这个非常重要;因为要使“@”前缀起作用，我们需要将属性值包装在 {{}} 中。

= 是双向的，因此如果您更改指令范围内的变量， Controller 范围变量也会受到影响

& 用于绑定(bind) Controller 范围方法，以便在需要时我们可以从指令中调用它

在您的情况下，您可能需要使用 = 而不是 @

看看下面的 fiddle (这不是我的，但它有很好的说明)http://jsfiddle.net/maxisam/QrCXh/

还有一些相关问题:

• What is the difference between '@' and '=' in directive scope in AngularJS?
• What is the difference between & vs @ and = in angularJS