將值插入模板AngularJS

我有一個標誌，我設置爲true/false，改變了某些項目在頁面上顯示的方式。我遇到了一些麻煩，讓我的模板獲得價值，並讓它實際上工作。正常的HTML（不在模板內）工作正常。將值插入模板AngularJS

restrict: 'E', 
     scope: { 
      speedDirection: "@", 
      speedName: "@", 
      value: "@", 
      editElements: "=" 
     }, 
     template: 
     '<div>'+ 
      '<p class="body-text">{{speedDirection}} '+ 
      '<input type="text" name="{{speedName}}" value="{{value}}" ng-show="editElements">'+ 
      '<span ng-hide="editElements">{{value}}</span>'+ 
      '</p>'+ 
     '</div>',

我想雖然使用editElements的動態模型價值，而不僅僅是通過值傳遞。這種方式，當它改變它將反映顯示模板中的更新。該變量是在對象定義在那裏我存儲我的測試數據：

function MyObject($scope) { 
    $scope.editElements = true;

有沒有什麼辦法讓這個工作？我試過傳遞它（如上），使用「@」和{{editElement}}位等等。自定義HTML部分：

<speed-limit speed-direction="A to B:" 
        speed-name="reverse" 
        value="{{newObject.speedLimit[0]}}" 
        editElement="editElements"> 
        </speed-limit>

更新：我已經安裝Batarang，它顯示我的自定義元素（限速）的特定部分有「editElement：空」。然而，editElements被引用的其他區域是正確設置的。這是一個奇怪的範圍問題？

來源

2013-02-06 Organiccat

您的ng-show/hides正在使用editElements，它與editElement的'scope：{...}'中定義的不同。你是否希望指令使用不同的名稱或相同的名稱？ –

如果我不需要像現在這樣通過HTML傳遞editElements，那麼我保持同名。 – Organiccat

您可以對該屬性使用相同的名稱，但您需要通過HTML將它傳遞給指令，因爲您正在創建隔離範圍。試試這個：在HTML中，editElements =「editElements」;在指令中：scope：{...，editElements：「=」}。保持原樣。 –

正如在評論中討論的，可用於屬性的名稱相同的名稱，但它必須是蛇的情況下，因此編輯元素=「editElements」：

<speed-limit speed-direction="A to B:" 
    speed-name="reverse" 
    value="{{newObject.speedLimit[0]}}" 
    edit-elements="editElements"> 
</speed-limit>

不要難過關於這個...我認爲每個Angular開發人員都浪費了至少一小時（或更多）的時間。

來源

2013-02-06 18:37:26

我在github上提交了一個問題，這不是我第一次遇到這種令人尷尬的事情。我認爲Angular應該拋出一些類型的錯誤。至少「沒有找到這樣的變量」一個。 – Organiccat

將值插入模板AngularJS

回答

相關問題