如何处理与Angularjs的多对多关系' $ scope变量

时间:2014-05-19 02:45:59

标签: javascript angularjs many-to-many angularjs-scope angularjs-service

我有两个服务来保存我的两个具有多对多关系的对象;任务(或步骤/行动)和这些任务所需的工具。每个任务都可以使用许多工具,每个工具都可以在许多任务中使用。这似乎是一个直截了当且常见的情况,但由于某些原因,我在设置$ scope时无法找到关于如何协调这一点的任何内容,以便我可以在视图中显示它。

使命服务(使命===步骤;我改名称中途)

  myApp.service('Missions', function(DefaultMissions, Tools){
      //set default missions stored in the DefaultMissions Service
      this.missions = DefaultMissions; 
      // to ensure unique id. if you change the preset no. of steps change this
      var newId = 9;

      //deletes a step 
      this.deleteStep = function(id){
        for (i in this.missions.missions) {
          if (this.missions.missions[i].id == id) {
            this.missions.missions.splice(i, 1);
          };      
        };
      };

      this.addStep = function(newStep){
        newStep.id = newId++;
        console.log("add step works if step is added and a new empty form is presented");
        this.missions.missions.push(newStep);
      };

      this.addTool = function(missionID, newToolId){
        for (i in this.missions.missions) {
          if (this.missions.missions[i].id == missionID) {
            this.missions.missions[i].tools.push(newToolId);
          };      
        };
      };

      //used to reset the newStep variable
      this.newEmptyStep = function(){
          return {
            id: "",
            step: "",
            time: {
              start: "",
              end: ""
            },
            place: "",
            tools: []
                };
        };
    });

工具服务

    myApp.service('Tools', function(){
        this.tools = {tools:[]};
        // to ensure unique id
        var newId = 1;

        //deletes a mission 
        this.deleteTool = function(id){
          for (i in this.tools.tools) {
            if (this.tools.tools[i].id == id) {
              this.tools.tools.splice(i, 1);
            };      
          };
        };

        this.addTool = function(newTool){
          newTool.id = newId++;
          console.log("add tool works if tool is added and a new empty form is presented");
          this.tools.tools.push(newTool);
        };

        //used to reset the newStep variable
        this.newEmptyTool = function(){
        return {
            id : "",
            name: "",
            type: "",
            owner: ""
          };
        };
    });

控制器

 myApp.controller('MissionCtrl', function($scope, Missions, Tools, SortService,  $localStorage){
//attributes  
  // connect the $localStorage to the $scope and set defaults
  $scope.$storage = $localStorage.$default(Missions.missions);

  //sets a new empty data structure to new step
  $scope.newStep = Missions.newEmptyStep();
  $scope.newTool = Tools.newEmptyTool();

  //Events  
  //delete a step event 
  $scope.deleteStep = function(id){
    Missions.deleteStep(id);
  };

  //reset the newStep variable after it is added to the $scope.missions
  $scope.addStep = function(){
    Missions.addStep($scope.newStep);
    //sets a new empty data structure to new step
    $scope.newStep = Missions.newEmptyStep();
  };

  //delete a tool event 
  $scope.deleteTool = function(id){
    Tools.deleteTool(id);
  };

  //reset the newTool variable after it is added to the $scope.missions
  $scope.addTool = function(mission){
    //add new tool to the Tools service
    Tools.addTool($scope.newTool);
    //add new tool id to the right mission in the Mission service
    Missions.addTool(mission.id, $scope.newTool.id);
    //here I'm trying to add the new tool to the $scope
    mission.tools.push($scope.newTool);
    //sets a new empty data structure to new step
    $scope.newTool = Tools.newEmptyTool();
  };

我从未真正认为这会起作用,因为$ scope。$ storage.missions保存工具ID而不是工具本身。但是我该怎么做呢?

我希望将工具连接到任务,以便我可以使用任务上的ng-repeat访问每个任务的工具,然后对工具进行子重复,如果我更新这个工具应该在使用该工具的所有任务中更新。

0 个答案:

没有答案