0

私は AngularJS が初めてで、いろいろいじっていました。ここに私のHTMLがあります：

<div ng-app ng-controller="nameController">
    <input type="text"  value="Jack" ng-model="fname" />
    <input type="text" value="Sparrow" ng-model="lname" />
    {{getFullName()}}
</div>

<input type="text" value="Hello" />

そして、ここにコントローラーコードがあります：

function nameController($scope) {
    $scope.getFullName = function () {
        return $scope.fname + " " + $scope.lname;
    };
}

value属性を使用して入力テキスト フィールドの値を設定しました。したがって、コントローラー関数getFullNameがこれらの値を読み取り、ページの読み込み時に完全な名前を返すことを期待していました。しかし、私が得るものは次のとおりです。

undefined undefined

そして入力テキストボックスは空です。なぜそうなのですか？

4

1 に答える 1

1

これらの入力のデフォルト値が必要な場合は、モデルを使用し$scopeてコントローラーのプロパティとして設定します。

function nameController($scope) {
    $scope.fname = "Jack";
    $scope.lname = "Sparrow";
    $scope.getFullName = function () {
        return $scope.fname + " " + $scope.lname;
    };
}

valueその後、マークアップから属性を削除できます。これにより、データがビューから適切に分離されます。これが実際の例です。

ngInitまたは、次のディレクティブを使用できます。

<div ng-app ng-controller="nameController" ng-init="fname = 'Jack'; lname = 'Sparrow'">
    <input type="text" ng-model="fname" />
    <input type="text" ng-model="lname" />
    {{getFullName()}}
</div>
于 2013-06-26T08:40:29.483 に答える