Javascript 角度嵌套状态必须使用来自同一控制器的$scope.parent,为什么?
我有一个表,它在一个名为$scope.sites的范围内循环 我正在提交一个表单,它将一个新站点保存到数据库中,然后添加到站点范围中 但是,当我更新$scope.sites时,它不会更新表。该表位于同一SiteCtrl控制器下 作用域肯定会被追加,就像我在表单发布后输出{{sites.length}}一样,它的值会增加(数据会出现在数据库中) 如果我加上 HTML 我的问题是,当作用域由于位于同一控制器中而应被继承时,我是否必须使用父级Javascript 角度嵌套状态必须使用来自同一控制器的$scope.parent,为什么?,javascript,angularjs,angularjs-ng-repeat,Javascript,Angularjs,Angularjs Ng Repeat,我有一个表,它在一个名为$scope.sites的范围内循环 我正在提交一个表单,它将一个新站点保存到数据库中,然后添加到站点范围中 但是,当我更新$scope.sites时,它不会更新表。该表位于同一SiteCtrl控制器下 作用域肯定会被追加,就像我在表单发布后输出{{sites.length}}一样,它的值会增加(数据会出现在数据库中) 如果我加上 HTML 我的问题是,当作用域由于位于同一控制器中而应被继承时,我是否必须使用父级 我是新手,了解一下这一点对我的学习非常有用。你的提琴除了
我是新手,了解一下这一点对我的学习非常有用。你的提琴除了显示代码外,什么都不做。我已经删除了提琴,因为有太多的代码,无法将其封装并工作。相关子集见上文。 {{ sites.length }}
myApp.config(function($stateProvider, $urlRouterProvider){
// The default route
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('home', {
url: '/home',
templateUrl: 'app/partials/welcome.html',
controller: 'WelcomeCtrl'
})
.state('entity', {
url: '/entity/:id',
params: { id: "" },
templateUrl: 'app/partials/entity/index.html',
controller: 'EntityCtrl'
})
.state('entity.site', {
url: '/site',
templateUrl: 'app/partials/site/index.html',
controller: 'SiteCtrl'
})
.state('entity.site.create', {
url: '/create',
templateUrl: 'app/partials/site/create.html',
controller: 'SiteCtrl'
})
myApp.controller('SiteCtrl', ['$scope', '$http', '$stateParams', function($scope, $http, $stateParams) {
$scope.entity_id = $stateParams.id;
$scope.site_uuid = $stateParams.siteuuid;
$scope.sites = {};
$scope.site = {};
$scope.errors = {};
$scope.result = {};
$scope.formData = {};
$http({ method: 'GET', url: 'siteurl' }).
success(function (data, status, headers, config) {
$scope.sites= data.data;
}).
error(function (data, status, headers, config) {
console.log(data.result);
console.log(data.code);
});
$scope.submitForm = function() {
$http.post('submiturl', $scope.formData).success(function(data) {
//Clear the form
$scope.formData = {};
$scope.site = data.data;
$scope.sites.push($scope.site);
}).error(function(data){
$scope.errors = data;
});
}
}]);
<div ng-controller="SiteCtrl">
<h1>Sites <a ui-sref="entity.site.create" class="btn"><i class="fa fa-plus"></i> Add New Site</a></h1>
<ui-view></ui-view> <!---- The form is included here by a ui-router state --->
<pre>{{ sites.length }}</pre> <!-- this doesnt update, nor does the table --->
<div class="form-group">
<label for="filter">Filter</label>
<input ng-model="filter" class="form-control">
</div>
<table class="striped">
<thead>
<tr>
<td>Name</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="site in sites | filter:filter">
<td><a ui-sref="entity.site.show({siteuuid:site.uuid})" ui-sref-active="child-active">{{ site.name }}</a></td>
</tr>
</tbody>
</table>
<h1>Create a New Site at {{ entity.name }} <a ui-sref="entity.site" class="btn">Close</a></h1></h1>
<pre>{{ result }}</pre>
<pre>{{ errors }}</pre>
<pre>{{ site }}</pre>
<pre>{{ sites.length }}</pre> <!---- This updates --->
<form name="createNewSiteForm" method="post" ng-submit="submitForm()">
<div class="form-group">
<label for="name">Site Name</label>
<input type="text" name="name" class="form-control" ng-model="formData.name" autocomplete="off" required />
{{ errors.name }}
</div>
<div class="form-group">
<input type="submit" name="create" value="Save {{ formData.name }}" />
</div>
</form>
$scope.parent.sites.push($scope.site);