Angular JS - 将范围传递给有状态模式

Question

我使用angular js来开发我的应用程序。我正在使用角度路由器进行模式对话的路由和角度绑定。

我有两种状态：

/admin/employees --> get all employees 
/admin/employees/update:employeeId -->for edit a particular employee. 

这是怎么我的依赖配置：

var app = angular.module('pipeline', [ 
    'ngResource', 
    'infinite-scroll', 
    'angularSpinner', 
    'jcs-autoValidate', 
    'angular-ladda', 
    'ui.router', 
    'mgcrea.ngStrap', 
    'toaster', 
    'ngAnimate' 
]); 

国家提供商配置

app.config(function($stateProvider, $urlRouterProvider){ 
$stateProvider 
    .state('pipeline', { 
     url: '/pipeline', 
     views: { 
      'main':{ 
       templateUrl: 'views/templates/pipeline.jsp', 
       controller: 'PipelineController' 
      }, 
      'buttonbar':{ 
       templateUrl: 'views/templates/button-bar.jsp', 
       controller: 'PipelineController' 
      } 
     } 
    }) 
    .state('employees',{ 
     url: '/admin/employees', 
     views: { 
      'main':{ 
       templateUrl: 'views/templates/employee.jsp', 
       controller: 'AdminController' 
      }, 
      'search':{ 
       templateUrl: 'views/templates/search-form.jsp', 
       controller: 'AdminController' 
      } 
     } 
    }) 
    .state('employees.add',{ 
     url: '/add', 
     parent: 'employees',    
     onEnter: ['$stateParams', '$state', '$modal', '$resource', '$scope', function($stateParams, $state, $modal, $resource, $scope){ 
      $modal({ 
       template: "views/templates/modal.edit.tpl.jsp", 
       scope: $scope, 
       show: true     
      }); 
     }] 
    }) 
    .state('employees.update',{ 
     url: '/update/:username', 
     parent: 'employees', 
     controller: 'EditEmployeeController', 
     onEnter: ['$stateParams', '$state', '$modal', '$resource', function($stateParams, $state, $modal, $resource){ 
      $modal({ 
       template: "views/templates/modal.edit.tpl.jsp",     
       show: true     
      }); 
     }] 
    }); 
    $urlRouterProvider.otherwise('/'); 
}); 

控制器对话框

app.controller('EditEmployeeController', function($scope, $state, $stateParams, AdminService, $modal){ 
$scope.adminService = AdminService; 
$scope.adminService.getSelectedEmployee($stateParams.username).then(function(){ 
    console.log("I am loaded."); 
}); 

$scope.hideModal = function(){ 
    $modal.hide(); 
     $state.go("employees"); 
    }; 
}); 

服务功能得到员工

'getSelectedEmployee': function(username){    
      var d = $q.defer(); 
      var entry = Employee.get({id:username, expand: true}, function(){     
       self.selectedEmployee = new Employee(entry.employee);     
       d.resolve(); 
      }); 
      return d.promise; 
     } 

从模板对话框

<div class="form-group"> 
    <label class="col-sm-2 control-label">ID</label> 
    <div class="col-sm-10"> 
     <label class="form-control">{{ adminService.selectedEmployee.username }}</label> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="col-sm-2 control-label">Name</label> 
    <div class="col-sm-10"> 
     <label class="form-control"> {{ adminService.selectedEmployee.fullname }} </label> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="col-sm-2 control-label">Name</label> 
    <div class="col-sm-10"> 
     <select class="form-control" ng-model="adminService.selectedEmployee.role.name"> 
      <option value="ROLE_ADMIN">ADMIN</option> 
      <option value="ROLE_FASTEST_USER">FASTEST USER</option> 
      <option value="ROLE_EXTERNAL_USER">EXTERNAL USER</option> 
     </select> 
    </div> 
</div> 
<div class="form-group"> 
    <label class="col-sm-2 control-label">Active</label> 
    <div class="col-sm-10"> 
      <div class="checkbox"> 
      <label> 
      <input type="checkbox" id="employeeActive" ng-model="adminService.selectedEmployee.active">    
      </label> 
     </div> 
    </div> 
</div> 
<div class="form-group"> 
    <div class="col-lg-10 col-sm-offset-2"> 
     <button class="btn btn-primary" type="submit" >Save</button > 
     <button class="btn btn-default" type="reset" ng-click="hideModal()" >Cancel</button > 
    </div> 
</div> 

我无法传递范围，该对话框并显示值的选定员工。

Answer 1

在EditEmployeeController控制器上创建模态，因为它具有可用的$范围。