如何在Angular.js中設置element的值

Question

為什么我不能在Angular.js中這樣做：

document.getElementById('divid').value = 'Change Text to This';

什么是“正確的”（角度）方式？

Answer 1

在Angular中，您可以使用ng-model指令在模型（即JS變量）和視圖（即<div> ）之間創建雙向數據綁定。 基本上，這意味着每當您更改視圖中的數據時（例如，通過輸入），更改將反映在JS變量中。 見下文：

HTML：

<html ng-app="myApp">
    <div ng-controller="MyCtrl">
        <div>{{myVariable}}</div>
        <input type="text" ng-model="myVariable" />
    </div>
</html>

JS：

/* App global module */
var myApp = angular.module('myApp');

/* Define controller to process data from your view */
myApp.controller('MyCtrl', function($scope) {

   $scope.myVariable = "initialValue"; // this is the variable that corresponds to text inserted in your input

});

在這里，myVariable將具有“ initialValue”作為初始值。 輸入的任何進一步更改將覆蓋此變量的值。

還要注意， {{myVariable}}將變量數據注入到div中。 當您更改輸入中的值時，div文本也將更改。

Answer 2

您必須將控制器綁定到您的標記並初始化Angular應用。

<div ng-app="myApp">
    <div id="divid" ng-controller="valueController">{{value}}</div>
</div>

然后，您只需在控制器中定義一個范圍變量

myApp.controller("valueController", function($scope) {
    $scope.value = "Hi!";
});

最好在頁面的HTML標簽中使用ng-app指令

的jsfiddle

如何在Angular.js中設置element的值

問題描述

2 個解決方案

解決方案1
5 已采納 2014-08-01 12:18:45

解決方案2
1 2014-08-01 12:18:03

如何在Angular.js中設置element的值

問題描述

2 個解決方案

解決方案1 5 已采納 2014-08-01 12:18:45

解決方案2 1 2014-08-01 12:18:03

解決方案1
5 已采納 2014-08-01 12:18:45

解決方案2
1 2014-08-01 12:18:03