Пробую разобраться с
ui-sortable.
Возникла не очень понятная ситуация: изучаю ангуляр по codeschool, там везде используется this, а в гуглении всегда попадается $scope.
Почему при таком коде:
html:
<body ng-controller="TestSortableController as SortCtrl">
<ul id="list_1" class="list_1" ui-sortable="list1Options" ng-model="SortCtrl.list1">
<li class="app" ng-repeat="app in SortCtrl.list1"> {{ app.name }} </li>
</ul>
<ul id="list_2" class="list_2" ui-sortable="list2Options" ng-model="SortCtrl.list2">
<li class="app" ng-repeat="app in SortCtrl.list2"> {{ app.name }} </li>
</ul>
</body>
js:
(function () {
var app = angular.module('testSortable', ['ui.sortable']);
app.controller('TestSortableController', function () {
this.list1 = [
{
name: "first name",
type: "second type"
}, {
name: "second name",
type: "third type"
}
];
this.list2 = [
{
name: "another name",
type: "another type"
},{
name: "another second name",
type: "another second type"
},
];
this.list1Options = {
placeholder: 'app',
connectWith: '.list_2'
};
this.list2Options = {};
});
})();
списки li перетаскиваются только в родительском ul, но стоит заменить this на $scope и убрать SortCtrl.%list%:
html:
<body ng-controller="TestSortableController">
<ul id="list_1" class="list_1" ui-sortable="list1Options" ng-model="list1">
<li class="app" ng-repeat="app in list1"> {{ app.name }} </li>
</ul>
<ul id="list_2" class="list_2" ui-sortable="list2Options" ng-model="list2">
<li class="app" ng-repeat="app in list2"> {{ app.name }} </li>
</ul>
</body>
js:
(function () {
var app = angular.module('testSortable', ['ui.sortable']);
app.controller('TestSortableController', function ($scope) {
$scope.list1 = [
{
name: "second name",
type: "third type"
}, {
name: "third name",
type: "fourth type"
}
];
$scope.list2 = [
{
name: "another name",
type: "another type"
},{
name: "another second name",
type: "another second type"
},
];
$scope.list1Options = {
placeholder: 'app',
connectWith: '.list_2'
};
$scope.list2Options = {};
});
})();
Как всё начинает работать в точности как надо.
Кто-нибудь может объяснить почему так получилось, и где мне в будущем использовать $scope, а где this? (и надо ли?)
Прошу прощения за длиннокод, надеюсь поможете ;(
