Question

首先，我不确定这是否可能，因为我还是刚开始有角度的。我有2个数组和2个视图，我希望每个视图与1个数组相关联。所以在一个页面上我有一个列出数组中所有项目的视图。当用户点击我拥有的其中一个项目时，它会推送到另一个阵列。然后我希望第二个视图只显示推入第二个数组的项目。

这是我的应用代码

scheduleApp.controller('ScheduleController', ['$scope', '$http', function($scope, $http){

    $scope.myShifts = [];

    $http.get('data/ninjas.json').success(function(data){
        $scope.shifts = data;


    });




//Available shifts main functions

$scope.removeShift = function(shift){
    var removeShift = $scope.shifts.indexOf(shift);
    shift.available = false;

    $scope.myShifts.push(shift);


};

}]）;

第一个可以正常显示原始数组的视图

<div class="content">
<h1 style="text-align: center">Available Shifts</h1>
  <button id="order" ng-click="order = 'name'">Order by Name</button>
  <input type="text" ng-model="search" placeholder="Search a shift" />
  <div id="titles">
    <span id="details">Shift Details</span><span id="times">Shift  
   Timeses</span>
  </div>
  <ul id="ninja-list">
    <li ng-repeat="shift in shifts | orderBy: order | filter: search" 
    ng-show="shift.available">
      <img ng-src="{{shift.thumb}}" style="margin:-12px 10px 0 0; 
    width:50px" ng-show="shift.thumb"/>
      <h3>{{shift.name}} - {{shift.rate | currency}}/Hr</h3>
      <div class="remove" ng-click="removeShift(shift)">CLAIM</div>
      <span class="belt">{{shift.date}}</span>
    </li>
  </ul>
  <form ng-submit="addShift()">
    <input type="text" placeholder="name" ng-model="newshift.name"/>
    <input type="text" placeholder="belt" ng-model="newshift.date"/>
    <input type="text" placeholder="rate" ng-model="newshift.rate"/>
    <input type="submit" value="Add" />
  </form>
 <a href="" ng-click="removeAll()">Remove All</a>
 </div>

第二个视图实际上只是填充以列出第二个数组。

 <div class="content">
 <h1 style="text-align: center">My Shifts</h1>
  <button id="order" ng-click="order = 'name'">Order by Name</button>
  <input type="text" ng-model="search" placeholder="Search a shift" />
  <div id="titles">
    <span id="details">Shift Details</span><span id="times">Shift 
  Times</span>
  </div>
  <ul id="ninja-list">
    <li ng-repeat="myShift in myShifts | orderBy: order | filter: search" >
      <img ng-src="{{myShift.thumb}}" style="margin:-12px 10px 0 0; 
     width:50px" ng-show="myShift.thumb"/>
      <h3>{{myShift.name}} - {{myShift.rate | currency}}/Hr</h3>
      <div class="remove" ng-click="removeShift(myShift)">CLAIM</div>
      <span class="belt">{{myShift.date}}</span>
    </li>
  </ul>
  <form ng-submit="addShift()">
    <input type="text" placeholder="name" ng-model="newshift.name"/>
    <input type="text" placeholder="belt" ng-model="newshift.date"/>
    <input type="text" placeholder="rate" ng-model="newshift.rate"/>
    <input type="submit" value="Add" />
  </form>
 <a href="" ng-click="removeAll()">Remove All</a>
 </div>

所以基本上$ shift在第一个视图中输出一切正常。当我将某个项目推送到$ myShifts时，我希望在我将视图更改为第二个视图时显示，但没有任何内容列出。

$ scope更新后，角度视图不会更新

0 个答案: