2013-08-28 197 views
0

定義範圍:{isoNetwork:'= network'},如果父範圍沒有'網絡'屬性,它會自動創建它? 以下PIC是父範圍: enter image description here隔離範圍「=」在指令中影響父範圍

這裏是代碼示例(在相同的jsfiddle:http://jsfiddle.net/yougen/mvYrJ/7/):

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

app.controller('AppCtrl', function($scope){ 
    $scope.leaveVoicemail = function(number, message, network){ 
     console.log("controller scope: ", $scope); 
     window.alert("Number: " + number + " said: " + message + ", by network: " + network); 
    }; 
}); 

app.directive('phone', function(){ 
    return { 
     restrict:'E', 
     scope:{ 
      isolatedAttributeNumber:'@number', 
      isoNetwork:'=network', 
      makeCall:'&' 
     }, 
     link:function(scope){ 
      scope.networks = ["Verizon", "AT&T", "Sprint"]; 
      scope.isoNetwork = scope.networks[1]; 
     } 
    }; 
}); 

HTML:

<div ng-app="app" ng-controller="AppCtrl"> 
     <phone number="555-1234" network="network" make-call="leaveVoicemail(number, message, network)"> 
      <div> 
       Number:{{isolatedAttributeNumber}} Network:<select ng-model="isoNetwork" ng-options="net for net in networks"></select> 
      </div> 
      Your message:<input type="text" ng-model="voiceMessage"><br> 
      <button class="btn" ng-click="makeCall({number: isolatedAttributeNumber, message: voiceMessage, network: isoNetwork})">Call Home!</button> 
     </phone> 
</div> 
+0

你的小提琴不工作。 – Chandermani

+0

對不起,我已經修復了網址 – jason

回答

1

是。這就是隔離範圍中=綁定的工作方式。該指令有自己的範圍,但您仍然需要一種與外部範圍進行通信的方式(因爲指令的作用域是隔離的,所以不是「父」範圍)。

=綁定提供了與外部的雙向綁定。因此,當您在指令<phone nework="network" ...中綁定模型時,您告訴Angular將network值設置在您的控制器範圍內。當您設置isoNetwork時,這發生在您的link函數中。

如果您正在尋找單向綁定,請考慮@綁定,該綁定是單向字符串綁定,與綁定的=不同,後者是雙向引用。

+0

感謝您的回答。 – jason