Question

我正在努力解决AngularJS问题。我在ng-repeat中有两个HTML块，并希望在每一步中显示其中一个。

$pdfPath = $config['upload_path'] . '/' . $fileName;
$im = new imagick();
$im->setResolution(300, 300);
$im->readImage($pdfPath);
$im->setImageFormat('jpeg');
$im->setImageCompression(imagick::COMPRESSION_JPEG); 
$im->setImageCompressionQuality(100);
// -flatten option, this is necessary for images with transparency, it will produce white background for transparent regions
$im = $im->flattenImages();
$im->writeImage($config['upload_path'] . '/' . str_replace('pdf', 'jpeg', $fileName));
$im->clear();
$im->destroy();

这些是我的HTML元素。

我每次都调用checkFunction方法来改变每一步的起始值。

我在控制器中的功能就是这个。

<div class="col-md-3" style="margin-top:80px" ng-init="checkFunction()">
    <div id="left_group_stage">
            <ul class="list-group" ng-if="started">
                    <li  class="list-group-item"> {{group_leaders[$index]}}</li>
                    <li  class="list-group-item"> {{group_runners[$index+1]}}</li>
            </ul>
            <ul class="list-group" ng-if="!started">
                    <li  class="list-group-item"> {{group_leaders[$index]}}</li>
                    <li  class="list-group-item"> {{group_runners[$index-1]}}</li>
            </ul>
    </div>
</div>

$ scope.started值随着我在控制台中看到的每一步都会改变但是ng-if总是取值。

我尝试使用$ scope。$ apply（）方法在$ timeout中强制查看更新，但这也没有帮助。一切正常，期待这一部分。

工作演示：https://plnkr.co/edit/lVSnbj?p=preview

Answer 1

怎么样

            <div class="col-md-3" style="margin-top: 80px"
                ng-init="checkFunction()">
                <div id="left_group_stage">
                    <ul class="list-group" ng-if="($index%2 === 0)">
                      <li class="list-group-item">List 1</li>
                        <li class="list-group-item">{{group_leaders[$index]}}</li>
                        <li class="list-group-item">{{group_runners[$index+1]}}</li>

                    </ul>
                    <ul class="list-group" ng-if="($index%2 !== 0)">
                      <li class="list-group-item">list 2</li>
                        <li class="list-group-item">{{group_leaders[$index]}}</li>
                        <li class="list-group-item">{{group_runners[$index-1]}}</li>

                    </ul>
                </div>
            </div>

您可以使用odd和even check this plunkr

来实现相同的行为

奇数：ng-if="($index%2 !== 0)"

甚至：ng-if="($index%2 === 0)"

所以它会交替出现。

范围变量更改不会影响视图

1 个答案: