訪問工廠返回的對象並在視圖中修改

我是AngularJS中較新的，所以如果我正在做一些愚蠢的事，請糾正我。訪問工廠返回的對象並在視圖中修改

我想擁有一個可以從視圖中更改的模型對象，其中一些方法必須公開其他私有。

所以我創建了一個工廠模型

angular.module('nanApp.models', []) 
    .factory('PoiModel', [function() { 
     function Poi() { 
      this.name; 
      this.tags; 
      this.address = {name: undefined, location: {lat: undefined, lng: undefined}}; 

      function addAddress(name, location) { 
       this.address = {name: name, location: {lat: location.lat, lng: location.lng}}; 
      } 

      function place() { 
       return this.address.name; 
      } 

      function print() { 
       return {name: this.name, address: this.address, tags: this.tags}; 
      } 

      return { 
       addAddress: function (name, location) { 
        return addAddress(name, location); 
       }, 
       place: function() { 
        return place(); 
       }, 
       print: function() { 
        return print(); 
       }, 
       name: this.name, 
       tags: this.tags 
      } 
     }; 

     return { 
      createNew: function() { 
       return new Poi(); 
      } 
     } 
    }]) 
;

從外觀我們可以創建一個POI，名稱和標籤是市民必須從視圖綁定和地址是私有的，但有一個公共的方法修改。

控制器看起來像

angular.module('nanApp.controllers.pois', ['nanApp.services', 'nanApp.models']) 
.controller('PoiCtrl', function ($scope, PoiModel) { 
    var vm = this; 

    vm.poi = PoiModel.createNew(); 

    vm.saveElement = function() { 
     console.log(vm.poi); 
     console.log(vm.poi.print()); 
    }; 

    vm.locationSuccess = function (name, location) { 
     vm.poi.addAddress(name, location); 
    }; 
});

則從查看我能夠調用locationSuccess和修改地址。從表單我想更改名稱，標籤，然後保存。

當我完成並調用saveElement（）是打印該

Object {name: "a", tags: "b"} 
Object {name: "", address: Object, tags: undefined} 
    address: Object 
    location: Object 
     lat: 50.8176986 
     lng: -0.12310700000000452 
    name: "Marine Parade, Brighton, United Kingdom" 
    __proto__: Object 
    name: "" 
    tags: undefined 
    __proto__: Object

我明白，因爲這是私人的第一打印不打印地址，但如果我把它公開是不確定的。在第二次打印中，爲什麼名稱和標籤未定義？

感謝，

來源

2015-11-05 Javier Salinas

最後我解決它使用更好的sintax。

angular.module('nanApp.models', []) 
    .factory('PoiModel', [function() { 
     var poi = {}; 
     var address = {name: undefined, location: {lat: undefined, lng: undefined}}; 

     poi.addAddress = function (name, location) { 
      address = {name: name, location: {lat: location.lat, lng: location.lng}}; 
     }; 

     poi.place = function() { 
      return address.name; 
     }; 

     poi.print = function() { 
      return {name: this.name, address: address, tags: this.tags}; 
     }; 

     return { 
      createNew: function() { 
       return poi; 
      } 
     } 
    }]) 
;

來源

2015-11-10 15:19:41

訪問工廠返回的對象並在視圖中修改

回答

相關問題