こんにちは。imは全く新しいangularjsです。私はフォームを作成して、フォームを配列に保存し、htmlに配列を表示したいと思っています。 私の質問はどのように配列のフォームを保存し、それらを常に保持し、それらを表示するか?ここどうやってフォームを配列に保存して、それらをangularjsに表示するのですか?
は私jsfidleです:http://jsfiddle.net/Lvc0u55v/12098/ ここに私のJSコード:
var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
$routeProvider
.when("/", {
templateUrl : "main.htm",
})
.when("/new", {
templateUrl : "new.html",
controller : "newController"
})
.when("/view", {
templateUrl : "view.html",
controller : "viewController"
});
});
app.controller("newController", ['myfactory',
function ($scope,myfactory) {
$scope.master = {};
$scope.update = function(user) {
$scope.master = angular.copy(user);
};
$scope.reset = function(form) {
if (form) {
form.$setPristine();
form.$setUntouched();
}
$scope.user = angular.copy($scope.master);
};
$scope.alluser = [{
name: "",
family: "",
code: "",
birth: "",
father: "",
explain: ""
}];
$scope.addItem = function(user) {
$scope.alluser.name.push(user.name);
$scope.alluser.family.push(user.family);
$scope.alluser.code.push(user.code);
$scope.alluser.birth.push(user.birth);
$scope.alluser.father.push(user.father);
$scope.alluser.explain.push(user.explain);
};
}]);
app.controller("viewController", function ($scope) {
$scope.msg = "I love Paris";
});
app.factory('myfactory', function() {
return {
array: function() {
return $scope.alluser;
}
};
});
と、これは私のHTMLフォームと私のindex.htmlです:
<br /><br />
<div ng-app="myApp" ng-controller="newController">
<form>
name : <input type="text" ng-model="user.name" /><br />
family : <input type="text" ng-model="user.family" /><br />
code melli : <input type="text" ng-model="user.code" /><br />
birth: <input type="text" ng-model="user.birth" /><br />
father: <input type="text" ng-model="user.father" /><br />
explain : <input type="text" ng-model="user.explain" /><br />
<input type="submit" ng-click="addItem(master)" value="Save" />
<ul>
<li ng-show="user.name">{{user.name}}</li>
<li ng-show="user.family">{{user.family}}</li>
<li ng-show="user.code">{{user.code}}</li>
<li ng-show="user.birth">{{user.birth}}</li>
<li ng-show="user.father">{{user.father}}</li>
<li ng-show="user.explain">{{user.explain}}</li>
</ul>
<div ng-controller="newController">
<ul>
<li ng-repeat="user in alluser"><a href="#">{{user.name}}</a></li>
</ul>
</div>
</form>
</div>
私が見ることができるエラーのかなりがあります。あなたはあなたの質問のためにフィドルのプランカを作成できますか?そうすれば、デバッグが容易になります。 –
@AlexRumbaNicked jsfiddleさんがブローを追加しました –
あなたはbroを見ましたが、あなたはその名前のテンプレートを宣言しましたが、あなたはそのページを作っていません。コントローラーの使用も冗長化されています。私は[プランカ](http://plnkr.co/)でそれを複製しようとします。しかし、それは15点のための私のためにあまりにも多くの仕事です:/ –