angularjs - ng-model の AngularJS デフォルト値

Question

のように ng-models にデフォルト値を取得させることは可能''ですか?

私はjQueryの関数を使用したフォームを持っていserializeます.aa値が存在しないときはいつでも、シリアライズされたデータにそれを含めます{name: '', age: ''}.

ただし、Angular を使用して投稿して$httpからモデルを取得して試してみると、空$scopeのように表示されます。undefined

Answer 1

ビューで使用する前に、スコープ内のモデルのプロパティを簡単に定義できます。

コントローラーのコードを表示すると、それらをスコープに追加するために更新する必要があるものを示します。

次のようになります。

アプリを定義した js ファイル内

angular.module("MyModule", []).controller('MyCtrl', ['$scope', function ($scope) {
    $scope.myModel = {name:""};
}]);

あなたのHTMLで

<input type="text" ng-model="myModel.name"/>

私はグローバル変数/関数を持たないことを好むので、Angular が提供する別の構文を使用してこれを回避し、縮小できるようにしています。

Answer 2

jQuery シリアライズを使用する必要はありません。

フォームは次のようにスコープにバインドする必要があります。

<form ng-controller="MyCtrl" ng-submit="submit()">
    <input type="text" name="name" ng-model="formData.name">
    <input type="text" name="age" ng-model="formData.age">
    <input type="submit" value="Submit Form">
</form>

function MyCtrl($scope) {
    $scope.formData = {};

    $scope.submit = function() {   
        $http.post('/someUrl', $scope.formData)
    };
}

そのため、$http では単純に $scope.formData を渡すことができます。

angularjsでフォームをシリアル化するより効果的な方法はありますか?

Answer 3

値が設定されているかどうかわからない場合があります。それがデフォルトの目的です。

変数に何らかの値があることを確認する必要があるときにこれを使用します。コントローラーで設定できます

$scope.possiblyEmptyVariable = $scope.possiblyEmptyVariable || "default value";

Angularがなくてもうまく機能します

// some object that may or may not have a property 'x' set
var data = {};

// Set default value of "default"
// carefull, values like 'null', false, 0 will still fall to defaults
data.x = data.x || "default";

// Set default value of "default"
// this will not fall to defaults on values like 'null', false, 0
data.x = !"x" in data || "default"; 

一連の値を設定する必要がある場合は、 angular.extend または jQuery.extend を使用してください

data.z = "value already set";
var defaults = { x: "default", y: 1, z: "default" };
var newData = angular.extend({}, defaults, data);
// { x: "default, y: 1, z: "value already set" }

それが役立つことを願っています