javascript - 了解将对象传递给模态时 'this' 的使用

Question

我正在实现一个使用的模态服务 here和 here我不明白 vm

的使用

第 13 行有 var vm = this;，然后使用 vm.。这是否会使它们成为模型并将它们暴露给 $scope ？

我试图传递并反对每次打开模式时都会改变的模式。我之前一直将对象设置为 $scope 变量。

要打开模式，我使用以下代码:

$scope.openExercise = function(exercise) {
    $scope.activeExercise = exercise;
    myModals.openExercise(exercise)
        .then(function(result) {
            console.log()
        }, function(err) {
            alert(err);
        });
};

和 console.log 显示了我的完整对象，但它没有显示在我试图将其显示为 {{exercise.name}} 等的模式中......

我的第一个问题是关于 var vm = this; 的使用，第二个问题是如何绑定(bind)/传递我的对象以在模态中显示？

非常感谢。

编辑 - 添加模态代码

<ion-content class="has-subheader has-footer" lazy-scroll delegate-handle="modalContent">
    <ion-slide-box ng-init="updateSlider()" ng-show="showimage" on-slide-changed="slideChanged(index)" class="exercise-slider-slides" does-continue="false" auto-play="false" show-pager="true">
        <ion-slide ng-repeat="sliderimage in activeExercise.images track by $index">
            <div ng-if="isNumber(sliderimage)" class="modalSliderThumbnail" style="background-image:url(http://.s3.amazonaws.com/medium/{{sliderimage}}.jpg)"></div>
            <div ng-if="!isNumber(sliderimage)" class="modalSliderThumbnail" style="background-image:url({{sliderimage}})"></div>
        </ion-slide>
    </ion-slide-box>
    <ion-list can-swipe="true" ng-hide="showimage">
        <form>
            <!--                 <label class="item item-input item-stacked-label">
                <span class="input-label energized">Title (Tap to edit)</span>
                <input type="text" class="title-input" placeholder="" initial-value ng-model="activeExercise.exerciseName"></input>
            </label> -->
            <label class="item item-input item-stacked-label">
                <span class="input-label energized">Description (Tap to edit)</span>
                <textarea placeholder="Tap to add a Description" initial-value ng-model="activeExercise.exerciseDescription"></textarea>
            </label>
        </form>
        <ion-item ng-click="showPopup()" class="item-icon-right param-button">
            <i class="icon ion-ios-plus-outline"></i> <span class="energized">Tap to add Variables</span>
        </ion-item>
        <ion-item ng-repeat="param in activeExercise.Params track by $index" ng-click="showPopup(param)">
            <strong>{{param.param}}</strong> : {{param.childParam}}
            <ion-option-button class="ion-minus-circled assertive button-options" ng-click="deleteParam(param)"></ion-option-button>
        </ion-item>
    </ion-list>
    <button class="button button-block button-gradient icon-right ion-ios-plus-outline add-to-programme-button" ng-click="addExerciseToProgramme(activeExercise, programme);showimage=true" ng-hide="showimage">Add to {{programme.programmeTitle}}</button>
</ion-content>

Answer 1

"vm = this"-> this 用于防止此范围的任何问题(即嵌套函数中的闭包)，例如如果您的 Controller 中有以下内容:

var values = {name: 'misko', gender: 'male'};
var log = [];
angular.forEach(values, function(value, key) {
    this.push(key + ': ' + value);
}, log);
expect(log).toEqual(['name: misko', 'gender: male']);

您会看到“this”在内部函数中比在外部函数中具有不同的含义。因此，在 Controller 的开头将 vm 设置为该值可以让您使用 vm 安全地引用您的作用域。

为了回答您的第二个问题，您需要发布用于模式的 Controller 的代码。