Angular 2 tree node up-down movement problem

Recently the problem of making a tree node move up and down and then implement sorting. Look directly at the picture:

Implements the move up or down of the selected query criteria. Combines the picklist components of the Primeng.

Here is the HTML code

  <P-tabpanelHeader= "Query condition">        <Divclass= "Row Selfheight"style= "margin-left:10px;">          <Divclass= "Col-4 selfheight"style= "padding:0px;">            <Divstyle= "margin:0 0 10px 0 ">All optional query criteria</Div>            <Divstyle= "margin:0px 6px;width:100%">              <Selectclass= "Select Form-control radius selfheight"style= "Padding:0.2rem 0.75rem;height:30px;margin-left: -6px;width:100%"(change)= "Changequeryconditionselect ($event. Target.value)">                <option*ngfor= "Let values of Selectdata"value= "{{values.attrgroupid}}">{{Values.attrgroupname}}</option>              </Select>            </Div>            <P-tree[value]= "Leftquerycondition"SelectionMode= "multiple"[(selection)]= "Selectleftcondition"(Onnodeselect)= "Queryconditionleftnodeselect ($event)"[Style]= "{' Height ': ' Calc (100%-64px) ', ' width ': ' 100% ', ' overflow ': ' Auto ', ' border-color ': ' #e0e0e0 ', ' Color ': ' #333333 ' , ' font-size ': ' 13px '} ">            </P-tree>          </Div>          <Divclass= "Col-2"style= "Padding:0px;margin-top:120px;text-align:center">            <Divstyle= "margin-bottom:10px">              <Buttontype= "button"class= "btn btn-clickstyle radius Pointer"(click)= "moverightcondition ()">                <Iclass= "fa fa-angle-double-right"Aria-hidden= "true"></I>              </Button>            </Div>            <Div>              <Buttontype= "button"class= "btn btn-clickstyle radius Pointer"(click)= "moveleftcondition ()">                <Iclass= "fa fa-angle-double-left"Aria-hidden= "true"></I>              </Button>            </Div>          </Div>          <Divclass= "Col-4 selfheight"style= "padding:0px;">            <Divstyle= "margin:0 0 10px 0 ">Selected query criteria</Div>            <P-tree[value]= "Rightquerycondition"SelectionMode= "multiple"[(selection)]= "Selectrightcondition"(Onnodeselect)= "Queryconditionrightselect ($event)"[Style]= "{' Height ': ' Calc (100%-34px) ', ' width ': ' 100% ', ' overflow ': ' Auto ', ' border-color ': ' #e0e0e0 ', ' Color ': ' #333333 ', ' Font-size ': ' 13px '} ">              <ng-templateLet-node ptemplate= "Default">{{Node.label}}<Select[(Ngmodel)]= "Node.symbol"type= "text">                  <option*ngfor= "Let values of operation"value= "{{Values.enumvalcode}}">{{Values.enumvalname}}</option>                </Select>              </ng-template>            </P-tree>          </Div>          <Divclass= "Col-2"style= "Padding:0px;margin-top:120px;text-align:center">            <Divstyle= "margin-bottom:10px">              <Buttontype= "button"class= "btn btn-clickstyle radius Pointer"(click)= "moveUp ()">                <Iclass= "fa fa-angle-up"Aria-hidden= "true"></I>              </Button>            </Div>            <Div>              <Buttontype= "button"class= "btn btn-clickstyle radius Pointer"(click)= "MoveDown ()">                <Iclass= "fa Fa-angle-down"Aria-hidden= "true"></I>              </Button>            </Div>          </Div>        </Div>      </P-tabpanel>

Here is the TS code:

MoveUp () {//Select only one on the right to move    if( This. selectrightcondition && This. selectrightcondition.length==1) {Let data= This. rightquerycondition; Let Index= 0; Data.foreach (record, i)= {        if(record[' fieldcode ') = = = This. selectrightcondition[0][' Fieldcode ']) {          returnindex =i;      }}) var temp; if(index = = 0 | | index > DATA.LENGTH-1) {         This. rightquerycondition =data; } Else{Temp=Data[index]; Data[index]= Data[index-1]; Data[index-1] =temp;  This. rightquerycondition =data; }}} MoveDown () {if( This. selectrightcondition && This. selectrightcondition.length==1) {Let data= This. rightquerycondition; Let Index= 0; Data.foreach (record, i)= {        if(record[' fieldcode ') = = = This. selectrightcondition[0][' Fieldcode ']) {          returnindex =i;      }}) var temp; if(Index = = = Data.length-1 | | Index < 0) {         This. rightquerycondition =data; } Else{Temp=Data[index]; Data[index]= Data[index + 1]; Data[index+ 1] =temp;  This. rightquerycondition =data; }    }  }

Angular 2 tree node up-down movement problem