Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/22.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何将范围变量从控制器传递到ionic框架中的$ionicModal_Javascript_Angularjs_Ionic Framework_Angularjs Scope - Fatal编程技术网

Javascript 如何将范围变量从控制器传递到ionic框架中的$ionicModal

Javascript 如何将范围变量从控制器传递到ionic框架中的$ionicModal,javascript,angularjs,ionic-framework,angularjs-scope,Javascript,Angularjs,Ionic Framework,Angularjs Scope,我正在使用ionic框架在Angular中构建一个应用程序,我试图将scope变量cropImgSrc传递到modal的scope,但它似乎不起作用。这是我的密码 控制器代码 angular.module('myApp').directive('addprofile',function(){ return{ restrict: 'E', templateUrl: 'client/modules/add-profile-details/add-profile.html',

我正在使用ionic框架在Angular中构建一个应用程序,我试图将scope变量cropImgSrc传递到modal的scope,但它似乎不起作用。这是我的密码

控制器代码

angular.module('myApp').directive('addprofile',function(){
return{
    restrict: 'E',
    templateUrl: 'client/modules/add-profile-details/add-profile.html',
    controllerAs: 'addProfileController',
    controller: function($scope,$reactive,$ionicModal){
        var vm = this;
        $reactive(this).attach($scope);
        this.helpers({
            imgSrc: function(){
                return '';
            },
            cropImgSrc: function(){
                return '';
            }
        });
        $ionicModal.fromTemplateUrl('client/modules/add-profile-details/crop-image-modal.html', {
            scope: $scope,
            animation: 'slide-in-up'
        }).then(function(modal) {
            vm.modal = modal;
        });
        this.addAvatar = function(files){
            if (files.length > 0) {
                var reader = new FileReader();
                reader.onload = function(e){
                    $scope.$apply(function(){
                        vm.cropImgSrc = e.target.result;
                        vm.modal.show();
                });
                };
                reader.readAsDataURL(files[0]);
            }
            else {
                this.imgSrc = undefined;
            }
        };
    }
} });
我的模板如下

<ion-view title="Crop Avatar">
<div class="modal">
    <div class="bar bar-header bar-positive">
        <h1 class="title">Your Avatar</h1>
    </div>
    <ion-content>
        <img ng-src="addProfileController.cropImgSrc">
    </ion-content>
</div>

你的化身


有人能告诉我哪里出了问题吗?

首先用

替换
,因为modal中的控件现在位于$scope中,您能尝试更改此行吗vm.modal=modal;使用$scope.modal=modal;

还有一个选项是打印日志并检查值。

请将所有“vm”替换为$scope 然后像这样替换模态代码

<ion-view title="Crop Avatar">
   <div class="modal">
      <div class="bar bar-header bar-positive">
         <h1 class="title">Your Avatar</h1>
      </div>
      <ion-content>
         <img ng-src="{{cropImgSrc}}">
      </ion-content>
   </div>
</ion-view>

你的化身

很抱歉,我在这里复制内容时只是输入错误!我试过了,但似乎没有通过,我甚至检查了官方的离子溶液,但没有任何效果。