Question

我正在开发一个AngularJs应用程序，它具有路径的ng-view。在对象中我有一个showOnHome选项，如果值设置为true，我想显示一个产品，如果设置为false，我想隐藏。

在nodejs服务器中：

app.get('/cameras/:id', function(req, res){
var cameraId = parseInt(req.params.id);
var data = {};
for (var i=0, len=cameras.length; i<len; i++){
    if(cameras[i].id === cameraId){
        data = cameras[i];
        break;
    }
}
res.json(data);
});

app.get('/cameras', function(req, res){
res.json(cameras);
});

var cameras = [
                      {
                        "id": 1,
                        "title": "BVO473N 850TVL IR Dome Camera",
                        "features": [
                          "2.0 Megapixel CMOS image sensor",
                          "2 megapixel high definition image quality",
                          "Minimum illumination of 0.1 Lux at F1.2 and 0 Lux with IR On",
                          "42 units of IR LEDs with an IR range of up to 30m",
                          "Supports dual streaming",
                          "Supports mobile surveillance via iOS, Android, Windows Mobile, BlackBerry",
                          "Supports plug and play - no port forwarding or networking knowledge required",
                          "Ingress Protection rating of IP66",
                          "Power Supply: DC 12V"
                        ],
                        "picture": "images/cam-look.png",
                        "showOnHome": true,
                      },
                      ];


<div class="row" ng-repeat="cam in cameras">
            <hr ng-if="!$first" />
            <div ng-show="cam.showOnHome">
                <div class="col-sm-4 col-sm-push-8">
                    <img ng-src="{{cam.picture}}" alt="Description"     class="img-responsive" />
                </div>

                <div class="col-sm-8 col-sm-pull-4">
                    <p class="lead">{{ cam.title }}</p>
                    <ul class="specs list-unstyled">
                        <li ng-repeat="feature in cam.features">{{ feature     }}</li>
                    </ul>
                    <strong class="more"><a href="#/product/{{ cam.id     }}">Learn More</a></strong>
                </div>
            </div>

            </div>

Answer 1

尝试冒泡你的ngShow / ngIf：

<div class="row" ng-if="cam.showOnHome" ng-repeat="cam in cameras">

如果放入内部，外部div仍会呈现。

另外，您初始化var cameras（出于调试目的？）在控制器模板中访问它应该是$scope.cameras。

如何根据json数据显示div中的内容

1 个答案: