我的AngularJs代碼不能正常工作得到這個錯誤 - TypeError：無法讀取屬性'＃<Object>'undefined

_>我需要的輸出是這個....當我試圖運行代碼它不工作正常，當我使用for循環用於打印結果以HTML它工作正常，當我試圖改變我的代碼概念angularjs我不能把它說obj中的價值，而不是定義＃對象並獲得多個錯誤我的AngularJs代碼不能正常工作得到這個錯誤 - TypeError：無法讀取屬性'＃<Object>'undefined

I'm sharing my code

HTML：

<!DOCTYPE html> 
<html ng-app="inputs"> 

    <head> 
    <script data-require="[email protected]" data-semver="1.4.1" src="https://code.angularjs.org/1.4.1/angular.js"></script> 
    <script src="script.js"></script> 
    </head> 

    <body ng-controller="MainCtrl"> 

<div id="result" style="width:600px; text-transform: capitalize;" align="right">Heloo</div> 

<div ng-repeat="component in components"> 


{{mylogic(component)}} 

</div>

JS：

var app = angular.module("inputs",[]); 

app.controller("MainCtrl",function($scope){ 

$scope.components=[{ 
    'name':{ 
    'fname':'{"placeholder":"First Name","description":"Enter First Name of the user","value":"abc","type":"text"}', 
    'lname':'{"placeholder":"Second Name","description":"Enter Last Name of the user","value":"ddd","type":"text"}' 
    }, 
    'password':'{"placeholder":"Password","description":"Enter password","value":"","type":"password"}', 
    'dim':{ 
    'dim2':{ 
     'dim3':'{"placeholder":"Sample","description":"Enter sample text","value":"ssds"}' 
    } 
    }, 
    'ary':{ 
    'ar10':{ 
     'ary2':{ 
     'ary3':'{"placeholder":"Sample","description":"Enter sample text","value":"acb"}' 
     } 
    }, 
    'ary11':'' 
    } 
}]; 

var result=''; 


$scope.mylogic=function(obj,source){ 
/* console.log(source);*/ 
    /*console.log(obj,source); 
    console.log(typeof source[obj]);*/ 
    if(typeof source[obj]=='string'){ 
    var val=[]; 
     if(source[obj]!=""){ 
    val =JSON.parse(source[obj]); 
     return obj +' <input type="'+val.type+'" value="'+val.value+'" placeholder="'+val.placeholder+'" type="text" ><br><code>Notes* '+val.description+'</code> <hr>'; 
    }else{ 
     return obj +' <input placeholder="'+obj+'" type="text" > <hr>'; 
    } 
    }else{ // console.log(components[obj]); 
    var subObj=source[obj]; var tempObj=[]; 
     for(item in subObj){ 
     // console.log(item,'--',subObj); 
     tempObj.push(obj+' > ' +mylogic(item,subObj) ); 
     } 
    return tempObj; 

    /* console.log(tempObj);*/ 
    } 
} 

/*for(component in $scope.components){ 
    result+= mylogic(component,$scope.components); 
    console.log('Component',$scope.components[component]); 
    console.log(result+= mylogic(component,$scope.components)); 
    console.log(mylogic); 
} 
*/ 
// console.log('Component',$scope.components[component]); 
var res=document.getElementById('result'); 
res.innerHTML=result; 
});

來源

2017-04-13 Deepak Vijay

請清潔代碼（刪除註釋行），並張貼堆棧跟蹤。 – undefined

@JK_Jha：當我打印只是組件打印JSON數組..但是當我打印{{「mylogic（組件）」}}使用ng - 重複其不工作..幫助我，如果你可以 –

@AustinKootz： - 我發佈輸出時，當我得到的時候，我在純javascript的同一個程序。我在這裏卡住 –

var app = angular.module("inputs", []); 
 
app.filter('unsafe', function($sce) { 
 
    return $sce.trustAsHtml; 
 
}); 
 
app.controller("MainCtrl", function($scope, $sce) { 
 

 
    $scope.components = [{ 
 
     'name': { 
 
      'fname': '{"placeholder":"First Name","description":"Enter First Name of the user","value":"abc","type":"text"}', 
 
      'lname': '{"placeholder":"Second Name","description":"Enter Last Name of the user","value":"ddd","type":"text"}' 
 
     }, 
 
     'password': '{"placeholder":"Password","description":"Enter password","value":"","type":"password"}', 
 
     'dim': { 
 
      'dim2': { 
 
       'dim3': '{"placeholder":"Sample","description":"Enter sample text","value":"ssds"}' 
 
      } 
 
     }, 
 
     'ary': { 
 
      'ar10': { 
 
       'ary2': { 
 
        'ary3': '{"placeholder":"Sample","description":"Enter sample text","value":"acb"}' 
 
       } 
 
      }, 
 
      'ary11': '' 
 
     } 
 
    }]; 
 

 
    var result = ''; 
 

 

 
    $scope.mylogic = function(obj, source) { 
 
     if (typeof source[obj] == 'string') { 
 
      var val = []; 
 
      if (source[obj] != "") { 
 
       val = JSON.parse(source[obj]); 
 
       var res = obj + ' <input type="' + val.type + '" value="' + val.value + '" placeholder="' + val.placeholder + '" type="text" ><br><code>Notes* ' + val.description + '</code> <hr>'; 
 
       return res; 
 
      } else { 
 
       var res = obj + ' <input placeholder="' + obj + '" type="text" > <hr>'; 
 
       return res; 
 
      } 
 

 
     } else { // console.log(components[obj]); 
 
      var subObj = source[obj]; 
 
      var res = ''; 
 
      for (item in subObj) { 
 
       // console.log(item,'--',subObj); 
 
       res += obj + ' > ' + $scope.mylogic(item, subObj); 
 
      } 
 
      return res; 
 
     } 
 
    } 
 
})

<html ng-app="inputs"> 
 

 
<head> 
 
    <script data-require="[email protected]" data-semver="1.4.1" src="https://code.angularjs.org/1.4.1/angular.js"></script> 
 
</head> 
 

 
<body ng-controller="MainCtrl"> 
 

 
    <div id="result" style="width:600px; text-transform: capitalize;" align="right">Heloo</div> 
 

 
    <div ng-repeat="component in components"> 
 
     <div ng-repeat="(key, value) in component" ng-bind-html="mylogic(key,component) | unsafe"> 
 

 
     </div> 
 
    </div> 
 

 
    </div> 
 
    </body> 
 

 
</html>

檢查它

來源

2017-04-13 09:02:09 Durga

： - 我需要一種方法來打印，而不使用2 ng-repeats ...我想用單個ng-repeat打印它，如果應該通過調用{{mylogic（）}} ex來完成： - ng-重複（組件中的組件）並調用{{mylogic（component）}} –

： - 可以幫助我以上面提到的方式來完成嗎？ –

感謝mahn（Y）它完美的工作 –

我的AngularJs代碼不能正常工作得到這個錯誤 - TypeError：無法讀取屬性'＃<Object>'undefined

回答

相關問題