我得到錯誤，像ReferenceError：matchcolor未定義

我正在生成隨機顏色瓷磚。除了一個以外，所有瓷磚都是相同的顏色並且那個人有淺色。如果用戶找到並單擊該淺色瓦片。然後棋盤生成另一個彩色圖塊。具有相同的邏輯。它工作正常在簡單的HTML，CSS，這裏的JavaScript https://js.do/code/141376但是當我在離子瓷磚板轉換創建，但是當我點擊瓷磚我得到像ReferenceError錯誤：matchcolor沒有定義。我得到錯誤，像ReferenceError：matchcolor未定義

HTML

<ion-view view-title="Dashboard"> 
<ion-content class="padding"> 
    <div ng-controller="helloCtrl"> 
    <div id="color_board"></div> 
    </div> 
</ion-content> 
</ion-view>

.controller('helloCtrl', [ '$scope',function($scope) { 

$scope.getRandomColor = function() { 
    var letters = 'ABCDEF'; 
    var color = '#'; 
    for (var i = 0; i < 6; i++) { 
     color += letters[Math.floor(Math.random() * 16)]; 
    } 
    return color; 
} 


$scope.ColorLuminance = function(hex, lum) { 
    hex = String(hex).replace(/[^0-9a-f]/gi, ''); 
    if (hex.length < 6) { 
    hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2]; 
    } 
    lum = lum || 0; 
    var rgb = "#", c, i; 
    for (i = 0; i < 3; i++) { 
    c = parseInt(hex.substr(i*2,2), 16); 
    c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16); 
    rgb += ("00"+c).substr(c.length); 
    } 
    return rgb; 
} 

$scope.shuffle = function(array) { 
    var currentIndex = array.length, temporaryValue, randomIndex; 
    while (0 !== currentIndex) { 
    randomIndex = Math.floor(Math.random() * currentIndex); 
    currentIndex -= 1; 
    temporaryValue = array[currentIndex]; 
    array[currentIndex] = array[randomIndex]; 
    array[randomIndex] = temporaryValue; 
    } 
    return array; 
} 

$scope.colorboard = function(){ 

    var colors = $scope.getRandomColor(); 
    console.log('random'); 
    var light = $scope.ColorLuminance(colors,0.3); 
    console.log('light'); 
    console.log(light); 
    var arr = []; 
    for(var i=1; i<=23; i++) { 
    arr.push(colors); 
    } 
    arr.push(light); 
    $scope.shuffle(arr); 
    console.log('shuffle'); 


    var output = ''; 
    for (var i = 0; i < arr.length; i++) { 
    output += '<div id="color_tile_'+i+'" style="background:'+arr[i]+';" ng-Click="matchcolor(\''+arr[i]+'\',\''+light+'\')"></div>'; 
    } 
    document.getElementById('color_board').innerHTML = output; 
} 

$scope.matchcolor = function(val,light){ 
    console.log(light); 
    console.log(val); 
    if(val == light) 
    { 
    colorboard(); 
    } 

} 

$scope.colorboard(); 



}])

來源

2017-03-11 Bhautik

你正在混合純js與角 –

我知道，但我不知道那麼多的角度，但我想爲此生成apk。這就是爲什麼我試圖在離子。任何解決方案都有幫助 – Bhautik

你的功能是唯一已知的控制器裏面，如果你想要的功能，以在視圖中知道你需要將它們定義爲$ scope的屬性。您在視圖上使用的每個變量和函數都必須是範圍的屬性。

$scope.matchcolor = function(val,light){ 
    console.log(light); 
    console.log(val); 
    if(val == light) 
    { 
    colorboard(); 
    } 

}

你也需要改變DI風格來推薦一個，因爲當你轉換你的應用程序到離子的所有代碼被微細化以及你的依賴變得未知，你需要改變這樣的：

.controller('helloCtrl', [ '$scope',function($scope) { 
//code here 
}])

來源

2017-03-11 17:18:19 Hikmat

我嘗試，但它沒有奏效。它有助於不會出現錯誤，但matchcolor（）函數不會調用。 – Bhautik

我得到錯誤，像ReferenceError：matchcolor未定義

回答

相關問題