jsonデータをクエリ文字列に渡して、そのデータを別のページで使用する方法

-1

ここには、書籍名、著者、価格、ISBN、およびカテゴリを含む書籍の詳細が含まれています。書籍名のユーザーのクリックは、それがjsonデータをクエリ文字列に渡して、そのデータを別のページで使用する方法

<script type="text/javascript" src="book.js"> 
    <body ng-app="mymodule" > 
    <div ng-controller="myController" > 
      <table border=2> 
      <thead> 
      <tr> 
       <th>ISBN</th> 
       <th>NAME</th> 
       <th>AUTHOR</th> 
       <th>CATEGORY</th> 
       <th>PRICE</th> 
      </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="book in books"> 
       <td>{{ book.ISBN }}</td> 
       <td ><a href="" ng-click="getdetail(book)">{{ book.Name }}</a></td> 
       <td>{{ book.Author }}</td> 
       <td>{{ book.Category }}</td> 
       <td>{{ book.price }}</td> 
       </tr> 
      </tbody> 
     </table> 

    books.js   
    var myapp = angular.module('mymodule', []); 
    myapp.controller("myController", function($scope, $http,$window) { 
     $http.get("https://api.myjson.com/bins/p4ujn").then(function(response) { 
      $scope.books = response.data; 
      $scope.getdetail=function(){ 
       $scope.getbookdetail=this.book; 
       $window.location.href = "orderpage.html";  
      } 
     }); 
    }); 
    orderpage.html 
    <script type="text/javascript" src="book.js"></script> 
    <body ng-app="mymodule" > 
     <div ng-controller="myController" > 
      {{getbookdetail.Name}}<br> 
      {{getbookdetail.Author}} 
      {{getbookdetail.price }}<br> 
     </div> 
    </body

出典

2017-01-17 Visha

をクエリ文字列使用して別のページにデータを渡す必要があるときに、あなたはこれを言った：

「をユーザーが書籍名をクリックすると、それはクエリ文字列を使用して別のページにデータを渡す必要があります」クエリーストリングは、このようなものに使用するための最良の方法ではありません。 ui-routerについて学び、これを処理するルートを設定する方がよいでしょう。あなたはあなたの初期状態を持っていますし、別の状態を作成して各本を表示することもできます。このような何か：次に

.state('initial', { 
    url: 'some/initial', 
    template: 'some/initial/template.html', 
    params: { 
    name: null, 
    price: null, 
    author: null, 
    isbn: null, 
    category: null 
    } 
}) 
.state('read-book-details', { 
    parent: 'initial', 
    url: 'some/url', 
    template: 'some/template.html', 
    params: { 
    name: null, 
    price: null, 
    author: null, 
    isbn: null, 
    category: null 
    } 
})

あなたは別の「状態」から移行している、あなたが望むようにパラメータを渡して同じようにそれを行う：オン

$state.go('read-book-details', 
    { name: book.name, price: book.price, author: book.author });

「その他」ページの$ state.params（すなわち、$ state.params.price）を介して渡されるパラメータを取得することができます。

A 2番目のオプションは、データを格納し、それ以外の場所から取得できるサービスを持つことです。これは明らかに、より小さな部分（名前、価格など）ではなく、より大量のデータを渡すときに役立ちます。

出典

2017-01-17 08:50:08 rrd

jsonデータをクエリ文字列に渡して、そのデータを別のページで使用する方法

答えて

関連する問題