AngularJS - 將新創建的孩子推到主窗體的孩子的選擇

Question

我有一個窗體有兩個選擇，（1）父和（2）孩子。一旦選擇了Parent項目，Children select選項就會分別動態填充。目前，兩者都在父控制器內。在每個選擇旁邊添加一個新的。當添加一個新父項時，將出現一個模式，一旦輸入新內容，就會輸入一個新父項，禁止用戶錯誤，更新數據庫，模式關閉，父控制器將新父項推送到範圍，並顯示在父母選擇。

兒童選擇是一個問題。它打開一個ChildrenController的模式，雖然我可以將新創建​​的子添加到數據庫，但我無法將模式關閉，因爲子選擇位於父控制器下方，因此無法將其推送到主窗體。

如何將新創建的孩子推送到主窗體的孩子選擇？

主要形式：

<div ng-controller="ParentController"> 
    <div id="ParentDiv"> 
    <select ng-model="parent" ng-options="parent.Name for parent in parents"> 
    <option value="" selected>Select Parent ..</option> 
    </select> 
    <button class="addNew" ng-click="openDialog()"><i class="icon-plus"></i> [ add new ]</button> 
    </div> 

    <div id ="ChildDiv"> 
    <select ng-model="child" ng-options="child.Name for child in parent.Childs"> 
    <option value="" selected>Select Child After Parent ..</option> 
    </select> 
    <button class="addNew" ng-click="openDialog()"><i class="icon-plus"></i> [ add new ]</button> 
    </div> 
</div> 

Blesh發現在聊天，我的解決辦法：2步

function ParentsCtrl($scope, $rootScope, $routeParams, $http, API, $location, $dialog) { 

    // Step #1 

    $scope.Parent = {}; 
    $scope.addModel = function (item) { 
    $scope.Parent.Childs = $scope.Parent.Childs || []; 
    $scope.Parent.Childs.push(item); 
}; 
....... 
} 

功能ChildrenCtrl（$範圍，$ rootScope，$ routeParams，$ HTTP， API，$ location，$ dialog）{

//步驟＃2

// Create 

    var copy = angular.copy($scope.child); 
    $http.post('/api/Childs/', copy) 
     .success(function() { 
      console.log('Copy Name 2: ' + copy.Name); 
      $scope.addModel(copy); 
     }) 
     .error(function (data) { 
      alert(data); 
     }); 
}; 
}; 

}

Answer 1

所以我們落得這樣做增加了，可以從孩子控制器被稱爲基於執行添加父控制器的方法是什麼選擇：

function ParentCtrl($scope) { 
    $scope.parentItems = [ 
     { name: 'foo', children: [] }, 
     { name: 'bar', children: [] } 
     { name: 'test', children: [] } 
    ]; 

    $scope.addChild = function(item) { 
     $scope.selectedParent.children.push(item); 
    }; 
} 


function ChildCtrl($scope, $http) { 
    $scope.doSomething = function() { 
     var item = { childName: 'test child' }; 
     /* TODO: stuff here */ 
     $scope.addChild(item); 
    }; 
} 

<div ng-controller="ParentCtrl"> 
    <select ng-model="selectedParent" ng-options="x.name for x in parentItems"></select> 
    <div ng-controller="ChildCtrl"> 
     <a ng-click="doSomething()">do something and add child</a> 
    </div> 
</div> 

這個想法是子控制器可以調用父範圍提供的add函數。