$ scope.account.nameから未定義のプロパティ 'name'を設定できません

Question

私は、ユーザー名と電子メールでフォームを送信するための小さな例を作っています。

私はこのように、入力にデフォルト値を設定したい：

let app = angular.module('myApp', []); 
 

 
app.controller('myController', function ($scope) { 
 
    let account = {}; 
 
    
 
    // TypeError: Cannot set property 'name' of undefined 
 
    $scope.account.name = 'Hermione'; 
 

 
    // TypeError: Cannot set property 'email' of undefined 
 
    $scope.account.email = 'hermione@gmail.com'; 
 
    
 
    $scope.form_submit = function ($event, account) { 
 
    $event.preventDefault(); 
 
    
 
    console.log('name', account['name']); 
 
    console.log('email', account['email']); 
 
    }; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<form ng-app="myApp" ng-controller="myController"> 
 
    <div> 
 
    <label>Name:</label> 
 
    <input type="text" ng-model="account.name" /> 
 
    </div> 
 
    
 
    <div> 
 
    <label>Email:</label> 
 
    <input type="email" ng-model="account.email" /> 
 
    </div> 
 
    
 
    <div> 
 
    <a href="javascript:;" ng-click="form_submit($event, account)">Submit</a> 
 
    </div> 
 
</form>

エラーメッセージ：

TypeError: Cannot set property 'name' of undefined

または

TypeError: Cannot set property 'email' of undefined

私の最初の質問：どうすれば修正できますか？

私も試しました。ng-model="account.name"をng-model="name"に置き換えてください。次に、$scope.name = 'Hermione'。それはうまく動作します。申し訳ありませんが、私はこの方法を使用したくありません。

2番目のケース：ViewDataを使用してデフォルト値を設定したいとします。私が試した：

その後

@{ 
    // I've set a breakpoint to check value before, ViewData["Name"] is not null 
    string name = ViewData["Name"]?.ToString() ?? string.empty; 
} 

を：

<input type="text" ng-model="account.name" value="@name" /> 

入力は常に空白であること。

私の2番目の質問は何ですか：間違っていますか？

p/s：私は質問：Cannot set property 'x' of undefined in AngularJs [duplicate]を参照しました。しかし、それは私の質問のようには思われません。私は答えを見つけることができません。次のようにコントローラのコードで

Answer 1

は、$スコープの下に新しいオブジェクトaccountを定義します。

.... 
    // change let account = {}; to the following: 
    $scope.account = {}; 

    // now you could set $scope.acount.name 
    $scope.account.name = 'Hermione'; 
    ... 

Answer 2

let app = angular.module('myApp', []); 
 

 
app.controller('myController', function ($scope) { 
 
    var account = {}; 
 
    
 
    // TypeError: Cannot set property 'name' of undefined 
 
    account.name = 'Hermione'; 
 

 
    // TypeError: Cannot set property 'email' of undefined 
 
    account.email = 'hermione@gmail.com'; 
 
    $scope.account=account; 
 
    
 
    $scope.form_submit = function ($event, account) { 
 
    $event.preventDefault(); 
 
    
 
    console.log('name', account['name']); 
 
    console.log('email', account['email']); 
 
    }; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<form ng-app="myApp" ng-controller="myController"> 
 
    <div> 
 
    <label>Name:</label> 
 
    <input type="text" ng-model="account.name" /> 
 
    </div> 
 
    
 
    <div> 
 
    <label>Email:</label> 
 
    <input type="email" ng-model="account.email" /> 
 
    </div> 
 
    
 
    <div> 
 
    <a href="javascript:;" ng-click="form_submit($event, account)">Submit</a> 
 
    </div> 
 
</form>