angular.js ng-hide无法正常工作

时间:2015-11-01 01:50:10

标签: angularjs alert ng-hide

我遇到使用ng-hide的问题。使用下面的所有代码,我能够以我想要的方式工作,直到我添加ng-hide属性,此时它拒绝显示任何图像。如果我把它留下来,图像都会像我期望的那样出现,让我相信我的控制器工作正常并且我已正确地连接它。我不明白的是什么?此外,你会看到我在函数中发出一个警告,以确保它被调用,但我不能为我的生活得到一个警告框使用角度工作。

app.js

'\0'

的index.html

(function () {
    var app = angular.module("mainApp", []);

    app.controller("StoriesListController", ["$http", StoriesListController]);

    function StoriesListController($http) {
        var vm = this;

        vm.title = "Tutorial List";
        vm.imageIndex = 0;

        activate();

        function activate() {
            vm.stories = [];
            $http.get("api/Story").then(function (response) {
                vm.stories = response.data;
            });
        }

        vm.setCurrentImage = function (index) {
            vm.imageIndex = index;
        };

        vm.isCurrentImage = function (index) {
            alert(index);
            return vm.imageIndex === index;
        };
    }
}());

StoryController.cs(我打电话来填充故事的API)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" ng-app="mainApp">
<head>
    <title>TEST</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    <script src="/Scripts/bootstrap.min.js"></script>
    <script src="Scripts/angular.min.js"></script>
    <script type="text/javascript" src="Scripts/App.js"></script>
    <link href="/Content/bootstrap.min.css" type="text/css" rel="stylesheet" />
</head>
<body>
    <h1>TEST</h1>
    <div ng-controller="StoriesListController as vm">
        <h1>{{vm.title}}</h1>
        <div class="container slider">
            <div ng-repeat="story in vm.stories">
                <img ng-src="{{story.PreviewImageURL}}" ng-hide="!isCurrentImage($index)" class="slide" />
            </div>
        </div>
    </div>
</body>
</html>

1 个答案:

答案 0 :(得分:2)

我想你只是想念vm。试试ng-hide="!vm.isCurrentImage($index)"