1

agularjs の読み取り専用入力に問題があります。スクリプトで読み取り専用の入力値を変更する選択があります。しかし、テーブルの ng-model でこれらの値を {{ng-model}} として出力しようとすると、表示されません。

<select name="well" onChange="Update(this.value)" ng-model="well" required>
<option value="Well-01">Well-01</option>
<option value="Well-02">Well-02</option>
<option value="Well-03">Well-03</option>
</select>
<label>Region:</label>
<input type="text" name="region" value="South" ng-model="region" disabled>
<label>State:</label>
<input type="text" name="state" value="Oklahoma" ng-model="state"  disabled>
<label>Field Office:</label>
<input type="text" name="office" value="Ringwood" ng-model="office" disabled>

フィドル: http://jsfiddle.net/NKyps/7/

変更すると {{well}} と表示されますが、入力は表示されません。手伝ってくれてありがとう。PS: また、誰かがデフォルト オプション (例: well-01) の使用方法を知っている場合、ドキュメントが読み込まれたときに入力が入力されますか?

4

3 に答える 3

0

angular.js の設計とは逆に、angular の外部で操作し、カスタム DOM 操作を行っています。ここに更新されたフィドルがあります。

スコープを持つコントローラーを使用して、モデルの値を定義します。

function ExampleController($scope) {

    $scope.Update = function () {
        if ($scope.well == "Well-01") {
            $scope.region = 'South';
            $scope.state = 'Oklahoma';
            $scope.office = 'Ringwood';
        }

        if ($scope.well == "Well-02") {
            $scope.region = 'North';
            $scope.state = 'Montana';
            $scope.office = 'Sidney';
        }

        if ($scope.well == "Well-03") {
            $scope.region = 'North';
            $scope.state = 'North Dakota';
            $scope.office = 'Tioga';
        }
    }

    $scope.well = 'Well-01';
    $scope.Update();
}

設計の主な問題は、1 つは JavaScript で、もう 1 つは dom で、2 つの合同モデルを維持しようとしていることです。Angular.js は dom 操作の処理に優れているため、モデルの更新についてのみ心配する必要があります。DOM を手動で更新しようとする代わりに、ビューをビルドして、モデルからそれ自体を生成し、JavaScript モデル ($scope 変数) のみを更新できるようにします。

于 2013-05-24T12:46:18.007 に答える
0

問題は、これらの属性が一部のモデルで拘束されていないことだと思います。{{variable}} angular を使用する場合、これは何らかのモデルにバインドされていると予想されます。

タグにスコープモデルとして追加しました：

<form ng-controller="Sarapastrule" name="form">
</form>

チェックイン: http://jsfiddle.net/NKyps/9/

于 2013-05-24T12:45:05.177 に答える
0

Bart が言ったように、あなたは AngularJS の基本的な概念を欠いています。

AngularJS は、双方向のデータ バインディングに関するものです。したがって、開発者がモデルを更新するだけである間に、DOM の更新を処理します。入力フィールドの値プロパティへのアクセスは、Angular の使用方法ではありません。

jsFiddle を動作するバージョンに更新しましたが、チュートリアルを読んで AngularJS の背後にある概念を理解する必要があります。

http://jsfiddle.net/BnqZS/1/

ご覧のとおり、最初にビジネス ロジックを処理するコントローラーが必要です。コントローラーでモデルを監視して更新します。だから代わりに

if (choice == "Well-01") {
    region.value = 'South';
    state.value = 'Oklahoma';
    office.value = 'Ringwood';
}

オプション入力にバインドしたモデルに実際にウォッチを設定して、次のように記述します。

$scope.$watch('well', function(choice) {
  if (choice == "Well-01") {
        $scope.region = 'South';
        $scope.state = 'Oklahoma';
        $scope.office = 'Ringwood';
    }

}

于 2013-05-24T12:51:45.190 に答える