2016-07-25 138 views
0

我是角JS的學習者。我正在嘗試$ http並將相應的值設置爲範圍變量。但它不起作用。以下是html的片段。下面角度範圍變量沒有設置

<div ng-app="fileapp" ng-controller="myctl" ng-init="hidevar=true"> 
    <div ng-hide="hidevar" class="ng-hide"> 
     <table> 
     <tbody ng:repeat="x in dataobj"> 
     <tr><td>{{x.url}}</td></tr> 
     </tbody> 
     </table> 
    </div></div> 

是成功的回調腳本角JS

success(function(data) { 
              console.log(data); 
              var d=angular.fromJson(data); 
              console.log('d is:'+d.url); 
              $window.alert(d.url); 
              $scope.dataobj=data; 
              //$scope.url=data.url; 
              $scope.hidevar =false; 

我正在在執行console.log預期的URL字符串值,並在window.alert。但是在$ scope.dataobj = data中沒有得到相同的結果。和 $ scope.hidevar = false;

ng隱藏未設置爲false,並且服務的json數據未設置爲dataobj。 以下是控制檯輸出。

enter image description here

我改名單的div喜歡以下,但仍沒有運氣

<div ng-hide="hidevar" class="ng-hide"> 
     <table> 
     <tbody> 
     <tr><td>{{dataobj.url}}</td></tr> 
     </tbody> 
     </table> 
    </div> 

我添加了一個隱藏的部分,更新範圍內的隱藏變量,但沒有被反映。

<!DOCTYPE html> 
<html> 

<head> 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.css"> 
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=RobotoDraft:300,400,500,700,400italic"> 
    <!-- Angular Material Dependencies --> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <!--<script src="app.js"></script> --> 
</head> 

<body ng-app="plnkrApp" ng-controller="DemoController" ng-init="myvar=true"> 
    <h1>Array</h1> 
    <table> 
    <tbody ng:repeat="x in array"> 
     <tr> 
     <td>{{x.url}}</td> 
     </tr> 
    </tbody> 
    </table> 
    <h1>Object</h1> 
    <table> 
    <tbody ng:repeat="x in object"> 
     <tr> 
     <td>{{x}}</td> 
     </tr> 
    </tbody> 
    </table> 
    <div ng-hide="myvar"> 
    <p>Hidden Section</p> 
    </div> 
    <script> 

    var app = angular.module('plnkrApp', []); 

app 
    .controller("DemoController", function($scope) { 
    $scope.array = [ {url: 'test1'}, {url: 'test2'}, {url: 'test3'}]; 
    $scope.object = {url: 'test1'}; 
    $scope.myvar=false; 
    }); 
    </script> 
</body> 

</html> 

隱藏部分未顯示。爲什麼數據沒有綁定到隱藏變量?

回答

0

你得到的是一個對象,而不是數組中的多個對象。

在這個對象上做ng-repeat只需要{{x}}而不是{{x.url}}但這是不對的。

用2個或更多這些對象的數組創建一個測試範圍變量。你會發現它會以你想要的方式工作。

$scope.test = [ {url: 'test1'}, {url: 'test2'}, {url: 'test3'}]; 

編輯:這裏是一個Plunkr示出差異:

http://embed.plnkr.co/6wSuAPHPCSZF60Pph85V/

+0

嗨請看看我的編輯。即使替換列表,它也不起作用。與桌子。 – GAK

+0

您將ng-hide硬編碼到您的類中:class =「ng-hide」。它永遠不會出現。 – austinthedeveloper

+0

我更新了你的演示代碼。請看編輯部分。 – GAK