Question

模态控制器：

var ModalDemoCtrl = function ($scope, $modal, $log) {

  $scope.open = function (data) {
        socket.on('thisUserAvatar',function(data){
            $scope.data = data;         
        }
  );

  var modalInstance = $modal.open({
      templateUrl: 'uploadavatar',
      controller: ModalInstanceCtrl,

    });

  };
};

// Please note that $modalInstance represents a modal window (instance) dependency.
// It is not the same as the $modal service used above.

模态控制器：

var ModalInstanceCtrl = function ($scope, $modalInstance) {

    socket.emit('loadAvatar');
    socket.on('thisUserAvatar', function(data){
        var  avatar= [];
        for(var i = 0; i < data.length; i++){
            var object = {};
            object.src= "/images/avatar/"+data[i].avatarname;
            avatar.push(object);
        }
        $scope.source=avatar;
        console.log($scope.source)
    });

};

HTML：

div#uploadDialog(title="Select Your Avatar")
    div(style="display: none")
        p#uploadAlertMsg    
    div
        tabset(justified='true')
            tab(heading='Your Avatars')
                container
                    span(ng-repeat='data in source')
                         img(ng-src="{{data.src}}", width='100px')
                         br
                         a(href='#') #1 Use Avatar
                         br
                         a(href='#') Change Avatar
                         br

需要点击我的模态标签，在我的ng-repeat加载之前，我需要在我的模态触发时自动加载内容。任何帮助将不胜感激

Answer 1

您需要将一些好东西传递给控制器实例才能访问数据。

模态演示控制器

var ModalDemoCtrl = function ($scope, $modal, $log) {

  $scope.open = function (data) {
        socket.on('thisUserAvatar',function(data){
            $scope.data = data;         
        }
  );

  var modalInstance = $modal.open({
      templateUrl: 'uploadavatar',
      controller: ModalInstanceCtrl,
      resolve: {
         data: function() {
            return $scope.data;   
         }
      }
  });

  modalInstance.result.then(function(data) {
    $scope.data = data; // Data has now come full circle - i dunno what u wanna pass back and forth but this is the way.
  }); 

  //Example with multiple returned bits o' data
  // modalInstance.result.then(function(someData) {
  //   $scope.data = someData.data; 
  //   $scope.avatar = someData.avatar;
  // });

};

模态实例控制器

var ModalInstanceCtrl = function ($scope, $modalInstance, data) {

    $scope.data = data;

    socket.emit('loadAvatar');
    socket.on('thisUserAvatar', function(data){
        var  avatar= [];
        for(var i = 0; i < data.length; i++){
            var object = {};
            object.src= "/images/avatar/"+data[i].avatarname;
            avatar.push(object);
        }
        $scope.source=avatar;
        console.log($scope.source)
    });

    // You might want a ok functionality so you can pass the info back to the modalDemoCtrl

    $scope.ok = function() {
        $modalInstance.close($scope.data); //or whatever data you wanna pass back just remember only one param - so if multple bits o' data make it an object or array.

        //$modalInstance.close({data: $scope.data, avatar: $scope.avatar}); // example to pass multiple things back.  
    };

ANGULARJS：在加载选项卡内容之前，需要单击我的模态选项卡

1 个答案: