Question

我试图通过在angularjs的控制器中定义的函数来获取一个可信的div的innerHTML但是每次都返回undefined ..有哪些替代方法或者我该如何处理这个问题？

$scope.genrate_HTML=function()
        {
            var read_string=document.getElementsByClassName("MainPage");
            //console.log(read_string);
            var p_tag= '\n<p id="test"> \n'+read_string.innerHTML+'\n </p>';




            //document.getElementById("createdHTML").value = p_tag ;
            //$compile( document.getElementById('createdHTML') )($scope);

        }

contenteditble div的班级名称是＆＃34; MainPage＆＃34;

VisualEditor.controller("GenrateHTML",function($scope){
        $scope.savefile=function()
        {
            $scope.genratedHTML_text=document.getElementById("createdHTML").value;
            var text_file_blob= new Blob([$scope.genratedHTML_text],{type:'text/html'});
            $scope.file_name_to_save=document.getElementById("file_name").value ;
            var downloadLink=document.createElement("a");
            downloadLink.download=$scope.file_name_to_save;
            downloadLink.innerHTML="Download File";
            if(window.URL!=null)
            {
                downloadLink.href=window.URL.createObjectURL(text_file_blob);
            }
            else
            {
                downloadLink.href = window.URL.createObjectURL(text_file_blob);
                downloadLink.onclick = destroyClickedElement;
                downloadLink.style.display = "none";
                document.body.appendChild(downloadLink);
            }

            downloadLink.click();
        }

        function destroyClickedElement(event)
        {
            document.body.removeChild(event.target);


        }
        $scope.toggleModal = function(){
            $scope.showModal = !$scope.showModal;
        };
        ///add details

        $scope.details=[];

        $scope.addDetails=function(){
            $scope.details.push({
                Title:$scope.Details_Title,
                meta_chars:$scope.Details_metaChars,
                version:$scope.Details_version,
                Auth_name:$scope.Details_AuthName,
                copyRights:$scope.Details_copyRights
            });
            document.getElementById("createdHTML").innerHTML = $scope.details;

        };

        $scope.$watch('details', function (value) {
            console.log(value);
        }, true);
        /////////////////////

        $scope.genrate_HTML=function()
        {
            var read_string=document.getElementsByClassName("MainPage");
            //console.log(read_string);
            var p_tag = '';
            for (var i = 0; i < read_string.length; i++) {
                p_tag += '\n<p id="test_"' + i + '> \n' + read_string[i].innerHTML + '\n </p>';


                document.getElementById("createdHTML").value = p_tag;
            }
            //$compile( document.getElementById('createdHTML') )($scope);

        }




    });

Answer 1

getElementsByClassName返回一个Array，因此，read_string变量是一个Array类型。你应该用for循环遍历read_string的元素。

注意：请同时检查p元素的ID。因为id必须是唯一的！

$scope.genrate_HTML = function() {
    var read_string = document.getElementsByClassName("MainPage");
    var p_tag = '';
    for (var i = 0; i < read_string.length; i++) {
        p_tag += '\n<p id="test_"'+i+'> \n'+read_string[i].innerHTML+'\n </p>';
    }
    /* Other code here... */
}

更新：请勿使用以下代码！如果read_string返回时没有元素，那么代码将崩溃！

但是如果它是一个1元素的数组，那么你可以取值：

$scope.genrate_HTML = function() {
    var read_string = document.getElementsByClassName("MainPage");
    var p_tag= '\n<p id="test"> \n'+read_string[0].innerHTML+'\n </p>';
    /* Other code here... */
}

我希望有所帮助。如果没有，则粘贴Controller的完整代码。

在angularjs中获得一个可信的div的内部html

contenteditble div的班级名称是＆＃34; MainPage＆＃34;

1 个答案: