Question

我上传图片并使用离子框架在前端显示，我实际上正在使用cordova应用程序。我想动态更改指令值，如

<ion-content ng-controller="AppDetailCtrl">
        <ion-item collection-repeat="Doc in DocTypes">
            {{Doc.RequiredDocument}}
            <div>
                <img ng-show='imgURI_{{Doc.RequiredDocID}} !== undefined' width="100px" height="150px" ng-src="{{imgURI_1}}">
                <button class="button" ng-click="takePicture()">Upload Picture</button>
            </div>
        </ion-item>
    </ion-content>

它在呈现的HTML中正确替换值但不能正常工作。如果我写硬编码值，那么它的工作正常。我怎样才能实现这种动态行为。

Answer 1

你应该使用这样的东西：

<ion-content ng-controller="AppDetailCtrl">
    <ion-item collection-repeat="Doc in DocTypes">
        {{Doc.RequiredDocument}}
        <div>
            <img ng-show="this['imgURI_' + Doc.RequiredDocID] !== undefined" width="100px" height="150px" ng-src="{{ 'imgURI_' + Doc.RequiredDocID }}">
            <button class="button" ng-click="takePicture()">Upload Picture</button>
        </div>
    </ion-item>
</ion-content>

this['imgURI_' + Doc.RequiredDocID]可能看起来有点奇怪，但实际上这对于javascript bracket notation来说是正常的，在您的情况下，引用对象属性的方式（this - 是一个范围对象）按变量名称（'imgURI_' + Doc.RequiredDocID）。

动态创建的指令属性不在angularjs中的ng-repeat中工作

1 个答案: