如何将数据从同一位置的一个地方传递到另一个地方?

时间:2018-10-16 05:56:22

标签: angular angular2-template angular4-forms angular4-router

enter image description here enter image description here我是角度2/4项目的新手。在此界面中,我会看到一个带有可编辑列表的弹出式搜索标签。

但是我不知道单击列表编辑按钮后将数据获取到主界面进行编辑的方法。

我需要的只是将当前项目传递到主编辑视图。

我的TS文件

Editmodeclose() {
        $("#SearchModal").modal("hide");
}

onSelected(IStockdetails: IStockdetails): void {
    this.selectedStock = IStockdetails;

}
my html in modal
 <div class="searchResult-Container">
                    <ul>
                        <li *ngFor="let stocks of stockdetail"
                            [class.selected]="stocks === selectedStock"
                            (click)="onSelected(stocks)">

                            <div class="row searchItem" style="margin:0px;">
                                <!--search item starts-->
                                <div class="col-md-10 col-sm-10 col-xs-12">
                                    <div class="row">
                                        <div class="col-md-6 col-sm-6 col-xs-12">

                                            <label>Item</label>
                                            <span>{{stocks.ItemID}}</span>
                                        </div>
                                        <div class="col-md-6 col-sm-6 col-xs-12">

                                            <label>Item Code</label>
                                            <span>{{stocks.ItemCode}}</span>
                                        </div>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <label>Item Desc</label>
                                            <span>{{stocks.ItemDescription}}</span>
                                        </div>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <label>Packing Type</label>
                                            <span>{{stocks.PackingtypeName}}</span>
                                        </div>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <label>Stock</label>
                                            <span>{{stocks.Stock}}</span>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-2 col-sm-2 col-xs-12 text-right">
                                    <span class="btn btn-success Editmode-Btn" (click)="Editmodeclose()"><i class="glyphicon glyphicon-pencil"></i></span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>

我的html左侧

  enter code here
    <div class="row">
                    <div class="col-md-12 col-sm-12 col-xs-12">
                        <div class="form-group">
                            <label>Item ID</label>
                            <div *ngIf="selectedStock">
                                <input [(ngModel)]="selectedStock.ItemID" id="ItemID" placeholder="name" class="form-control" name="ItemID" #ItemCode="ngModel" ngModel>
                            </div>
                        </div>
                    </div>
                </div>

1 个答案:

答案 0 :(得分:0)

尝试一下:

Editmodeclose(IStockdetails: IStockdetails): void {
        console.log(IStockdetails);
}

onSelected(IStockdetails: IStockdetails): void {
    this.selectedStock = IStockdetails;

}
my html in modal
 <div class="searchResult-Container">
                    <ul>
                        <li *ngFor="let stocks of stockdetail"
                            [class.selected]="stocks === selectedStock"
                            (click)="onSelected(stocks)">

                            <div class="row searchItem" style="margin:0px;">
                                <!--search item starts-->
                                <div class="col-md-10 col-sm-10 col-xs-12">
                                    <div class="row">
                                        <div class="col-md-6 col-sm-6 col-xs-12">

                                            <label>Item</label>
                                            <span>{{stocks.ItemID}}</span>
                                        </div>
                                        <div class="col-md-6 col-sm-6 col-xs-12">

                                            <label>Item Code</label>
                                            <span>{{stocks.ItemCode}}</span>
                                        </div>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <label>Item Desc</label>
                                            <span>{{stocks.ItemDescription}}</span>
                                        </div>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <label>Packing Type</label>
                                            <span>{{stocks.PackingtypeName}}</span>
                                        </div>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <label>Stock</label>
                                            <span>{{stocks.Stock}}</span>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-md-2 col-sm-2 col-xs-12 text-right">
                                    <span class="btn btn-success Editmode-Btn" (click)="Editmodeclose(stocks)"><i class="glyphicon glyphicon-pencil"></i></span>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>