2014-09-12 6 views
0

Я хочу загрузить список колледжей из вызова ajax и отображения в пользовательском интерфейсе. Я использую структуру AngularJS для этого примера.

сильфона код, если для College.html

<div class="page-header" ng-controller="CollegeController as collegeCntrl"> 
    <div class="page-header"> 
    <h3>Add/Manage Colleges</h3> 
    </div> 
<ng-view />  
</div> 

Ниже код для list.html,

<table class="table table-striped table-bordered"> 
    <thead> 
     <tr> 
      <th>College-ID</th> 
      <th>College-Name</th>    
      <th>Edit College</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="college in collegeCntrl.collegeList | orderBy : 'collegeName'"> 
      <td>{{college.collegeId}}</td> 
      <td>{{college.collegeName}}</td>           
      <td> 
       <a href="#/college/edit" class="btn btn-primary" ng-click="collegeCntrl.editCollege(college)">Edit</a> 
      </td> 
     </tr> 
    </tbody> 
    <tfoot> 
     <tr> 
      <td colspan="4"> 
      <a href="#/college/addPage" class="btn btn-primary active">Add College</a> 
      </td>   
     </tr> 
    </tfoot> 
</table> 

Ниже код от college.js,

angular.module("CollegeModule",[]) 
.constant("collegeListURL","../rest/ser/college/list/One") 
.controller("CollegeController",function($location, $http, collegeListURL){ 
$location.url("/loadingImage"); 

    $http.get(collegeListURL).success(function(data){ 
     this.collegeList = data; 
     $location.url("/college/list"); 
    }); 

    this.editCollege = function(college){ 
     this.selectedCollege = college; 
    } 
} 

в приведенном выше кодексе, пожалуйста, ознакомьтесь с кодом для

$http.get(collegeListURL).success(function(data){ 
    this.collegeList = data; 
    $location.url("/college/list"); 
}); 

«это» ключевое слово не работает для метода успеха, поэтому я заменил выше код ниже блок кода

(function(collegeCntrl){ 
    $http.get(collegeListURL).success(function(data){ 
     collegeCntrl.collegeList = data; 
     $location.url("/college/list"); 
    }); 
})(this); 

И это сработало.

Так что мой вопрос - это код, который работал для меня, может быть хорошей практикой в ​​контроллере AngularJS, или есть другой способ отсылать «это»?

+3

Почему вы используете это вместо $ scope? –

+2

Если вы собираетесь использовать список колледжей в своем HTML-формате, вы можете просто направить его на '$ scope'. – Goodzilla

+0

, но я прочитал в блоге, связанном с Angular.js, что использование этого в контроллере Angular является хорошей практикой. Правильно ли я понимаю? –

ответ

0

Вы должны вводить $ объем в контроллере и установить $scope.collegeList = data;

Тогда в вас HTML вместо college in collegeCntrl.collegeList, вы просто удалить collegeCntrl.: college in collegeList

+0

, но эта ссылка лучше всего подходит http://java.dzone.com/articles/angularjs-%E2%80%93-different-ways –

+0

Однако в этом случае 'this' не относится к' $ scope' , –

1

Там в question on the matter of this vs $scope.

Общее использование для $scope - это все, что вы хотите получить непосредственно на свой HTML.

Вы можете использовать this для методов или атрибутов, которые вы хотели бы держаться подальше от $scope. Но я предпочел бы оставаться последовательным и не смешивать this и $scope, поэтому я обычно придерживаюсь $scope.

 Смежные вопросы

  • Нет связанных вопросов^_^