2017-01-08 4 views
0

をangularjs、ショーのdiv要素は、ユーザーがボタンをクリックした場合、私は、インドのプロパティ情報を持つdiv要素を持っている

ページが別のページにリダイレクトされなければならないと私の全体のdivが

をコピーする必要がありますそして別のページで開い

<div class="box2"> 
        <div style=""> 
         <img src="2.jpg" style="border: 2px solid #EEEEEE; height: 180px;" class="col-lg-6 col-md-6 col-sm-12 col-xs-12" /> 
        </div> 
        <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 select"> 
         <div class="borderdiv"> 
          <span ng-repeat="i in data2" style="font-size:16px; font-weight:bold">{{i.A}}</span> 
         </div> 
         <div class="borderdiv"> 
          <span ng-repeat="i in data2" style="font-size:12px; font-weight:lighter">Available For <b>{{i.B}}</b> </span> 
         </div> 
         <div class="borderdiv"> 
          <span ng-repeat="i in data2" style="font-size:14px; font-weight:normal">Area <b>{{i.C}}</b> Security <b> Rs. {{i.F}}</b></span> 
         </div> 
         <div class="borderdiv"> 
          <span ng-repeat="i in data2" style="font-size:14px; font-weight:normal">Rental Unit In<b style="cursor:pointer"> {{i.D}}</b></span> 
         </div> 
         <br /> 
         <div class="borderdiv"> 
          <span ng-repeat="i in data" style="font-size:14px; font-weight:normal"> 
           Features 
           <br /> 
           <span class="glyphicon glyphicon-eject" style="margin-left:20px;"></span> 
           <span class="glyphicon glyphicon-chevron-left" style="margin-left:20px;"></span> 
           <span class="glyphicon glyphicon-chevron-right" style="margin-left:20px;"></span> 
          </span> 
         </div> 
         <br /> 
         <div class="borderdiv"> 
          <span ng-repeat="i in data2" style="font-size:14px; font-weight:normal">{{i.E}}</span> 
         </div> 
        </div> 
       </div> 

これは私のdiv

<button ng-click="click()">click to view data</button> 

これは私のボタンであります

他のページで同じデータを見たい場合はどうすればいいですか?

+0

2ページ目は、同じプロジェクトまたは別のプロジェクト/ウェブサイトにあるのですか? –

+0

同じプロジェクト\ ... –

+0

他のページで同じHTMLコード(DIV)を使用できます。ボタンをクリックすると、$ rootScopeにオブジェクトを保存し、次のページの$ rootScopから再度読み取ることができます。 –

答えて

0

divを生成するサーバー側の構造テンプレートを作成する必要があります。例PHP

function getViewData() { 
    ?> 
    <button ng-click="click()">click to view data</button> 
    >?php 
} 

でそして、あなたはこのようにPHPファイルを使用している場合は、あなたの構造のどこにでも追加できます。

<?php getViewData(); ?> 
0

私は含まれてい角度工場で行くことにあなたを提案します探しているデータを検索し、それぞれのページでhtmlテンプレートを使用します。

ボタンのコードは次のように新しい角度ファクトリーを作成します

<button ng-click="click()">click to view data</button> 

と同じまま

angular.module('myApp').factory('appVariables',function(){ 
     var data2=[]; 
     return{ 
       data2,data2 
     } 
}); 

クリックが含まれている必要がありあなたのコントローラ()メソッド

angular.module('myApp').controller('appController',function($scope,appVariables){ 

     $scope.click=function(){ 
      appVariables.data2=$scope.data2; 
     } 
}) 

別のページに行くappVariablesはコントローラに依存しており、アプリ全体で同じdata2を取得できます。

このコードは、あなたが提供する情報が非常に少ないため、genricです。

0

サンプルをまとめました。私は複数のhtmlページを作成することはできません。だからあなたは別のファイルにそれらを配置する必要があります。

var app = angular.module('sample', []);] 
 
//JS1 
 
app.controller('page1Controller', ['$scope','$http','$rootScope', function($scope, $http){ 
 
    
 
    $scope.page1 = {}; 
 
    $scope.page1.title = "Page1"; 
 
    
 
    $scope.click = function(page){ 
 
    $rootScope.page = page; 
 
    } 
 
    
 
}]); 
 

 

 
//JS2 
 
app.controller('page2Controller', ['$scope','$http','$rootScope', function($scope, $http){ 
 
    
 
    $scope.init = function(){ 
 
    alert("alrt") 
 
    $scope.page2 = $rootScope.page; 
 
    } 
 
    
 
    
 
}]);
<div ng-app="sample"> 
 
    
 
    <!--Page1--> 
 
    <div ng-controller="page1Controller"> 
 
    
 
    <div>{{page1.title}}</div> 
 
    <button ng-click="click(page1)">click to view data</button> 
 
</div> 
 
    
 
    <!--Page2--> 
 
    <div ng-app="sample"> 
 
    <div ng-controller="page2Controller" ng-init="init()"> 
 
    
 
    <div>{{page2.title}}</div> 
 
    
 
</div>

関連する問題