2014-09-12 4 views
0

Вот HTML и Javascript для простого примера Angular JS. В этом примере почему функция связи не запущена и установлена ​​scope.flag как true (boolean) вместо 'true' (строка)?Почему функция link в моей директиве AngularJS не запущена?

Javascript:

angular.module('truthyTypes', []) 
    .directive('myDirective', function(){ 
    return { 
     template: '<div>flag value: {{ flag }}<br/>flag type: {{ flag | typeOf }}</div>', 
     scope: { 
     flag: '@' 
     }, 
     link: function(scope){ 
     scope.flag = scope.flag === 'true'; 
     } 
    } 
    }) 
    .filter('typeOf', function(){ 
    return function(input){ 
     return typeof input; 
    } 
    }) 
; 

HTML:

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Example - example-example78-production</title> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.1/angular.min.js"></script> 
    <script src="script.js"></script> 
</head> 
<body ng-app="truthyTypes"> 
    <div my-directive flag="true"></div> 
</body> 
</html> 

Живой пример: http://plnkr.co/edit/jqk5529FmdGsxK6Xj8LZ?p=preview

+0

возможно дубликат [AngularJS - Доступ изолированный сфера в функции связи директивы] (http://stackoverflow.com/questions/17111016/angularjs-access-isolated-scope-in-directives-link-function) –

ответ

1

Вы используете одностороннюю привязку, поэтому любые обновления, которые вы вносите в переменную флага в директиве, не будут передаваться обратно контроллеру.

Использование двухсторонняя привязок (= вместо @), чтобы изменить значение флага:

scope: { 
    flag: '=' 
} 

Внутри функции связи, то вы можете установить флаг в любое соответствующее значение, например,

scope.flag = true;