Javascript 在AngularJS中创建工厂以将数据从指令传递到控制器

我有一个指令，在进行$http调用后，为ng repeat list的每个元素返回一个数组

看起来像这样：

    var app = angular.module('myApp');


app.directive('release', ['musicInfoService', 'dataService',
  function(musicInfoService, dataService) {

    return {
      restrict: 'E',
      scope: {
        release: '=',
        artist: '='
      },
      template: '<div class="release">' +
        '<div class="wrapper"><img class="img-responsive" ng-src="{{imageSrc}}"/><div id="text" ng-click="getVersions(release)"></div></div>{{release.title | characters:45}}' +
        '<ul><li ng-repeat="version in defaultFormat">{{version.format}}</li><li ng-show="basicFormat">{{basicFormat}}</li></ul>'+
        '</div>',
      replace: false,
      link: function(scope, elem, attr) {
        var defaultImage = 'img/record-default.png';
        scope.imageSrc = defaultImage;
        musicInfoService.getAlbumInfo(scope.artist.name, scope.release.title)
          .success(function(data) {
            if (data.error) return;

            var image = data.album.image[2],
              imageUrl = defaultImage;

            if (image['#text'] !== '') {
              imageUrl = image['#text'];
            }

            scope.imageSrc = imageUrl;
          });
        var defaultFormat = scope.release.format;
        musicInfoService.getReleaseVersions(scope.release.id)
        .success(function(data) {
            if (data.error) return;

            var format = data.versions,
              formats = scope.release.format;

            if (format !== '') {
              formats = format;
            }

            scope.defaultFormat = formats;
            dataService.setItems(scope.defaultFormat);
          })
          .error(function($scope) {
            scope.basicFormat = scope.release.format;
            dataService.setItems(scope.basicFormat);
         });
      }
    };
  }
]);

app.factory('dataService', [function($scope){
   var _items= "";
   return { 
          setItems:function(value){
             _items=value;
          },
          getItems:function(){
             return _items;
          }
  };
}]);

然后在script.js的末尾

function VersionController($scope, dataService) {
  $scope.versions = dataService.getItems();
  console.log($scope.versions);
}

以下是完整的文件：

    (function(){

var app = angular.module('myApp', ['chieffancypants.loadingBar', 'ngResource', 'ui.bootstrap', 'truncate']);

var Ctrl = function(musicInfoService) {
  this.musicInfoService = musicInfoService;
};

Ctrl.prototype.onArtistChange = function(){
  var artist = this.artist;

  if(angular.isUndefined(artist)) return;

  var pos = artist.name.toLowerCase().indexOf(', the');

  if (pos != -1) {
    artist.name = 'The ' + artist.name.slice(0, pos);
  }
};

Ctrl.prototype.reset = function(){
  this.sliding = false;
  this.name = undefined;
};

Ctrl.prototype.search = function(name) {
  var _this = this;

  if (name) {
    _this.musicInfoService.searchArtists(name)
    .success(function(data) {
      _this.clicked = false;
      _this.results = data.results;
    });
  }
};

Ctrl.prototype.getDetails = function(id) {
  var _this = this;

  _this.musicInfoService.getDetails(id)
  .then(function(data){
    _this.artist = data.artist;
    _this.releases = data.releases;
    _this.onArtistChange();

   _this.getRows = function(array) {
    var rows = [];
    var i,j,temparray,chunk = 4;
    for (i=0,j=array.length; i<j; i+=chunk) {
        temparray = array.slice(i,i+chunk);

        rows.push(temparray);
    }
    return rows;
    };
    _this.rows = _this.getRows(data.releases);
  });

  _this.clicked = true;
  _this.sliding = true;
};

Ctrl.$inject = ['musicInfoService'];

app.controller('Ctrl', Ctrl);



}());

function VersionController($scope, dataService) {
  $scope.versions = dataService.getItems();
  console.log($scope.versions);
}

（函数（）{
var app=angular.module（'myApp'，['chieffancypants.loadingBar'，'ngResource'，'ui.bootstrap'，'truncate']）；
var Ctrl=函数（MusicInfo服务）{
this.musicInfoService=musicInfoService；
};
Ctrl.prototype.onArtistChange=函数（）{
var-artist=this.artist；
如果（角度未定义（艺术家））返回；
var pos=artist.name.toLowerCase（）.indexOf（'，the'）；
如果（位置！=-1）{
artist.name='The'+artist.name.slice（0，位置）；
}
};
Ctrl.prototype.reset=函数（）{
这是错误的；
this.name=未定义；
};
Ctrl.prototype.search=函数（名称）{
var_this=这个；
如果（姓名）{
_this.musicInfoService.searchArtists（名称）
.成功（功能（数据）{
_this.clicked=false；
_this.results=data.results；
});
}
};
Ctrl.prototype.getDetails=函数（id）{
var_this=这个；
_this.musicInfoService.getDetails（id）
.then（功能（数据）{
_this.artist=data.artist；
_this.releases=data.releases；
_这个.onArtistChange（）；
_this.getRows=函数（数组）{
var行=[]；
变量i，j，temparray，chunk=4；
对于（i=0，j=array.length；我能发布你所有的代码吗？你的指令名是什么？我看不出你在视图中实际在哪里使用你的指令……还有，你是指控制器吗？我正在试图理解你在这里构建的体系结构。@午餐317-更新！还添加了一个Plunker。很好的应用程序，喜欢UI！这是id，就角度约定而言，您的代码有点奇怪。您有没有理由在指令中而不是在控制器中调用
dataService
和
musicInfoService
？问题是您想将数据与内容分离，但您已经将它们耦合在一起了。您可以使用
$sco您控制器中的pe
变量来保存数据。我有一个完全不同的代码版本（在S.O.用户的帮助下，正如我目前正在学习的那样），其中一位用户对其进行了完全重构，因此我不太确定如何回答您的问题，因为我仍在尝试自己找出代码…另一方面，感谢您的称赞！除了学习如何使用Angular构建东西之外，我没有任何自命不凡的地方：）Angular是一个有趣的框架，当然，很高兴你玩得开心！也就是说，你在你的范围内手动使用原型继承的方式（以及你调用视图的方式）似乎非常不传统，甚至没有必要。我将发布一个重构，并试着借助一些文档来解释我的步骤。
function VersionController($scope, dataService) {
  $scope.versions = dataService.getItems();
  console.log($scope.versions);
}

    (function(){

var app = angular.module('myApp', ['chieffancypants.loadingBar', 'ngResource', 'ui.bootstrap', 'truncate']);

var Ctrl = function(musicInfoService) {
  this.musicInfoService = musicInfoService;
};

Ctrl.prototype.onArtistChange = function(){
  var artist = this.artist;

  if(angular.isUndefined(artist)) return;

  var pos = artist.name.toLowerCase().indexOf(', the');

  if (pos != -1) {
    artist.name = 'The ' + artist.name.slice(0, pos);
  }
};

Ctrl.prototype.reset = function(){
  this.sliding = false;
  this.name = undefined;
};

Ctrl.prototype.search = function(name) {
  var _this = this;

  if (name) {
    _this.musicInfoService.searchArtists(name)
    .success(function(data) {
      _this.clicked = false;
      _this.results = data.results;
    });
  }
};

Ctrl.prototype.getDetails = function(id) {
  var _this = this;

  _this.musicInfoService.getDetails(id)
  .then(function(data){
    _this.artist = data.artist;
    _this.releases = data.releases;
    _this.onArtistChange();

   _this.getRows = function(array) {
    var rows = [];
    var i,j,temparray,chunk = 4;
    for (i=0,j=array.length; i<j; i+=chunk) {
        temparray = array.slice(i,i+chunk);

        rows.push(temparray);
    }
    return rows;
    };
    _this.rows = _this.getRows(data.releases);
  });

  _this.clicked = true;
  _this.sliding = true;
};

Ctrl.$inject = ['musicInfoService'];

app.controller('Ctrl', Ctrl);



}());

function VersionController($scope, dataService) {
  $scope.versions = dataService.getItems();
  console.log($scope.versions);
}