我在AngularJS中創建了一個計算器應用程序,但我在ng-repeat
和ng-click
中遇到了問題。ng-click - 使用函數獲取屬性值
<div class="col-md-3">
<button ng-repeat="op in operations" name="btn{{ op.name }}"
value="{{ op.symbol }}" class="operationbutton"
ng-click="{{ op.function }}"> {{ op.symbol }}
</button>
</div>
在我app.js
,我的控制器裏面,我有綁$scope
變量的操作。
$scope.operations = [
{ "symbol": "+", "name": "add", "function": "add()" },
{ "symbol": "-", "name": "subtract", "function": "subtract()" },
{ "symbol": "*", "name": "multiply", "function": "multiply()" },
{ "symbol": "/", "name": "divide", "function": "divide()" }
];
我試着把引號從函數名中除去,但事實證明,JavaScript對象值必須包含字符串。
我可以做這樣的事情
ng-click="{{ op.name === 'add' ? add() : op.name === 'subtract' ? subtract()
: op.name === 'multiply' ? multiply() : op.name === 'divide' ? divide() : multiply()}}"
但是,這似乎是一個可怕的做法。有什麼辦法可以改進這個,所以我可以根據操作調用一個函數?
您不能分配的實際功能'op.function'而一些字符串表達式的HTML? –
使用switch語句爲每個符號創建單個函數,將該函數賦值給ng-click(不帶任何符號)。最後,爲了使它工作,你必須創建另一個名爲op_symbol的變量,或類似的東西,並在你的方法中使用它。 另外我建議閱讀關於bindToController/controllerAs語法。這在控制器中使用$ scope會下降,因爲您可以將vars,函數分配給控制器的函數 - 測試此類控制器會更容易。 – kornicameister