Question

我正在尝试将图像<src>与在$parent控制器范围内创建的对象绑定。这是我到目前为止的代码：

<div class="form-group">
    <img style="max-height: 250px; max-width: 200px;" src="app/test_resources/guest.png" id="sectionImg"></img>
    <input type="button" class="btn btn-primary" style="width: 100%;height: 30px; display: flex;align-items: center;justify-content: center;" value="Load Image" onclick="$('#loadFileImg').click();" />
    <input type="file" accept="image/*" class="form-control" id="loadFileImg" ng-required="true" ng-model="$parent.section.img" onchange="readURL(this);" style="display:none;" name="file"/>
</div>

这是我用来从文件系统加载图像并将其绑定到<src>的{{1}}的函数

#sectionImg

这就是为我的控制器内部创建新部分而设计的逻辑：

<script>

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#sectionImg')
                .attr('src', e.target.result)
                .width(150)
                .height(200)
                .css({'margin-bottom':'10px'});
            console.log($('#sectionImg').attr('src'));
        };

        reader.readAsDataURL(input.files[0]);
    }
}      

</script>

现在$ scope.section还应该包含img属性（换句话说，$scope.section = {}; $scope.createSection = function(){ console.log("New section details:"+angular.toJson($scope.section)); console.log("Image: "+angular.toJson($scope.section.img)); }应该是从文件加载的图像的路径）但是由于某种原因$scope.section.img除了加载的路径之外都有一切img，我猜$scope.section不起作用。

谁能告诉我这里我做错了什么？提前谢谢！

注意： 表单的其余部分映射到$ parent.section.description和$ parent.section.name，这样可以正常工作，所以$ parent不是任何人之前的问题建议。

无法将图像<src>映射到位于父作用域中的对象

0 个答案: