angular2加入jquery plugin ,利用button上下排序項目功能

[Anna_Lai]

大家晚安
之前是學PHP 近一個月開始接觸angular2
在網路上教學基礎懂 實作卻總是遇到困難也不知如何解決
javascript說明也能懂 當object array結構一複雜 又撞牆老半天
開始發覺自己腦袋是一維陣列 不知變通
請問大家是如何學習如何debug?都是自學找網路文件嗎?

今天在試排序功能 一整天就這麼過了
希望可以有btn上下排序for angular2 ,但找到的都是拖曳方式
於是使用jquery套件加入-http://jsfiddle.net/maziar/P2XDc/
我使用的順序如下:
1.index.html加入jquery及jquery-sortable.js的script路徑
2.typings.d.ts 定義:
interface JQuery{
sortable:any;
}
3.把網路這篇script全放進onInit(){}

測試可以正常使用
但我把裡面item項目改為 *ngFor 方式帶入陣列
卻無法上下移動了
是因為ngFor是雙向綁定,實際上陣列順序沒改變於是不能調整嗎?
謝謝

[JimmyHo]

你想要的這個功能，那應該是要從資料著手
資料是這樣

data:[
{label: '1', level:1},
{label: '2', level:2},
{label: '3', level:3},
]

再來用js的方式來控制sort/reverse，應該就可以解決你的問題了

[poychang]

使用 *ngFor 將資料帶進 template 的時候，你可以想像資料順序是由陣列本身決定

因此你可以透過操作陣列順序來達到你的需求，關於 Javascript 的 Array 操作，可以參考下圖來做

我推薦使用 splice 來處理，希望能幫到你

[Anna_Lai]

好的 我再試試 謝謝你