Javascript 角度嵌套状态必须使用来自同一控制器的$scope.parent,为什么?

Javascript 角度嵌套状态必须使用来自同一控制器的$scope.parent,为什么?,javascript,angularjs,angularjs-ng-repeat,Javascript,Angularjs,Angularjs Ng Repeat,我有一个表,它在一个名为$scope.sites的范围内循环 我正在提交一个表单,它将一个新站点保存到数据库中,然后添加到站点范围中 但是,当我更新$scope.sites时,它不会更新表。该表位于同一SiteCtrl控制器下 作用域肯定会被追加,就像我在表单发布后输出{{sites.length}}一样,它的值会增加(数据会出现在数据库中) 如果我加上 HTML 我的问题是,当作用域由于位于同一控制器中而应被继承时,我是否必须使用父级 我是新手,了解一下这一点对我的学习非常有用。你的提琴除了

我有一个表,它在一个名为$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);