angularjs scope繫結策略
阿新 • • 發佈:2018-12-13
控制器controller中的的scope與controller中指令的scope的互動
ScopeEqual.html
<!DOCTYPE html> <html ng-app="MyModule"> <head> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="css/bootstrap-3.0.0/css/bootstrap.css"> </head> <body> <div ng-controller="MyCtrl"> Ctrl: <br> <input type="text" ng-model="ctrlFlavor"> <br> Directive: <br> <drink flavor="ctrlFlavor"></drink> </div> <script src="js/angular-1.3.0.js"></script> <script src="ScopeEqual.js"></script> </body> </html>
ScopeEqual.js
var myModule = angular.module("MyModule", []); myModule.controller('MyCtrl', ['$scope', function($scope){ $scope.ctrlFlavor="百威"; }]) myModule.directive("drink", function(){ return { restrict:'AE', scope:{ flavor:'=' }, template:'<input type="text" ng-model="flavor"/>' } });