2016-06-29 68 views
1

我是新角度。我讀了很多博客,關於@/=之間的指令隔離範圍之間的區別,但我仍然感到困惑。 這是我嘗試過的一個小例子。爲什麼隔離的作用域(=)不能使用字符串?

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 
<head> 
 
    <title>Directive Test</title> 
 
    
 
    <script type="text/javascript"> 
 
    var app = angular.module('myApp', []); 
 
    app.controller('MyCtrl', ['$scope', function ($scope) { 
 

 
    }]); 
 
    app.directive('personInfo', [function() { 
 
     return { 
 
     restrict: 'EA', 
 
     scope: { 
 
      name: '=', 
 
      age: '=' 
 
     }, 
 
     template: "My name is {{name}} . My age is {{age}}", 
 
     link: function (scope, iElement, iAttrs) { 
 
      console.log(scope.name); 
 
     } 
 
     }; 
 
    }]) 
 
    </script> 
 
</head> 
 
<body ng-controller="MyCtrl"> 
 
    <person-info name="deepak" age="25"></person-info> 
 
</body> 
 
</html>

輸出:

My name is . My age is 25

我沒有得到爲什麼名字是undefined,其中作爲時代的到來爲25。 當我在做name: @,一切正常再罰款。

我不知道爲什麼=作品與數值,但不與strings.I知道用於單向和用於雙向綁定=@,但在我的例子,我什麼都沒有做與父母範圍。

回答

4

=是一個雙向綁定,所以當你使用一個字符串時,它認爲你試圖傳遞一個名爲deepak的作用域變量。要傳遞字符串,必須用引號name="'deepak'"包裝它們。

數字工作原因是因爲變量不能以數字開頭,所以它們被解釋爲一個值。

如果使用@它將是一個單向綁定,它不能傳遞範圍變量。這隻會讓你傳遞值,所以name="deepak"name="{{somevar}}"將工作。

1

如果您使用=,該指令需要在後面的表達式上有一個作用域變量。

所以通過<person-info name="deepak">你告訴角度尋找$scope.deepak,在這種情況下,這等於null,因此結果。

我猜這是行得通的,如果你把數字是因爲你不能用純數字命名變量,所以它會做一些智能猜測來替代你的值。

要使用=時使用的文本字符串,你需要添加引號的附加層 <person-info name="'deepak'">

相關問題