控制器数据以角度设置另一页 [英] Controller data set another page in angular

问题描述

之后点击 user.html 列表.我必须在 productDetail.html 文件中显示点击的产品数据.

ProductController.js

 $scope.selectedProduct = function(product){控制台日志(product.post_title)；}

user.html

<a href="#/{{$index}}/{{$index}}" ng-mouseover="selectedProduct(p)" ng-click="selectedProduct(p)" style="text-decoration:none;"><ion-item class="item widget uib_w_109 d-margins item-button-left" data-uib="ionic/list_item_button" data-ver="0">{{p.post_title}} 
</ion-item></a>

productDetail.html

<a><ion-item data-uib="ionic/list_item_button" data-ver="0">产品名称:{{clickedProduct.post_title}} <br>产品 ID:{{selected.product}}
发布日期:{{product.post_title}}</ion-item></a>

解决方案

需要更多说明，无论是在同一视图中还是在产品点击时显示不同的 HTML.

这是我理解您的问题和评论的Plunker.https://plnkr.co/edit/Ii52KZkjpNndmAMvQQYU?p=preview

 $scope.products = [{ID: 'P1',post_title: '产品 1',post_date: '2016 年 7 月 20 日',post_author: 'John Doe'}, {ID: 'P2',post_title: '产品 2',post_date: '2016 年 7 月 29 日',post_author:'简·多伊'}, {ID: 'P3',post_title: '产品 3',post_date: '2016 年 7 月 12 日',post_author:'约翰威廉'}];$scope.selectedProduct = {};$scope.selectProduct = 函数(索引){$scope.selectedProduct = $scope.products[index];};

这里是 HTML

 
产品列表<div ng-repeat="产品中的产品"><离子项目>{{product.post_title}}<button ng-click="selectProduct($index)">select</button><br></ion-item>

<div ng-include="'product.html'"></div>

其他 HTML 将选择相同的角度控制器.

After that clicked user.html list. I have to show clicked product data in productDetail.html file.

ProductController.js

 $scope.selectedProduct = function(product)


{
    console.log(product.post_title);

  }

user.html

<div ng-repeat="p in users.products | filter:searchBox">

    <a href="#/{{$index}}/{{$index}}" ng-mouseover="selectedProduct(p)" ng-click="selectedProduct(p)" style="text-decoration:none;">
    <ion-item    class="item widget uib_w_109 d-margins item-button-left" data-uib="ionic/list_item_button" data-ver="0">
    {{p.post_title}} <br>

    </ion-item>
    </a>
    </div>

productDetail.html

<div class="users">

    <a>
    <ion-item   data-uib="ionic/list_item_button" data-ver="0">Product Name : {{clickedProduct.post_title}} <br>
        Product Id : {{selected.product}}<br>
        Post Date :  {{product.post_title}}


    </ion-item>
    </a>
    </div>

解决方案

Need more Clarification, whether both HTML are shown in same view or different on product click.

here is a Plunker i made understanding your question and comments. https://plnkr.co/edit/Ii52KZkjpNndmAMvQQYU?p=preview

  $scope.products = [{
    ID: 'P1',
    post_title: 'product 1',
    post_date: '20th July 2016',
    post_author: 'John Doe'
  }, {
    ID: 'P2',
    post_title: 'product 2',
    post_date: '29th July 2016',
    post_author: 'Jane Doe'
  }, {
    ID: 'P3',
    post_title: 'product 3',
    post_date: '12th July 2016',
    post_author: 'John William'
  }];
  $scope.selectedProduct = {};
  $scope.selectProduct = function(index){
    $scope.selectedProduct = $scope.products[index];
  };

and here is the HTML

 <div>
    Product List
    <div ng-repeat="product in products">
        <ion-item>
          {{product.post_title}}
          <button ng-click="selectProduct($index)">select</button>
          <br>
        </ion-item>
    </div>
  </div>
  <div ng-include="'product.html'"></div>

the other HTML will pick the same angular controller.

这篇关于控制器数据以角度设置另一页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！