如何在加載DOM之前運行角度控制器？

-1

我在我的角度控制器中有一些代碼，我希望這些代碼能夠在文檔上運行，但是我注意到角度在創建dom時運行它。即使它提供了正確的輸出，它也會產生一些控制檯錯誤，因爲最初圖像的src屬性值爲空。我在我的角度控制器中設置了src屬性值。所以最初我得到一些控制檯錯誤。有沒有辦法在加載DOM結構之前運行控制器？如何在加載DOM之前運行角度控制器？

HTML：

<div class = "tab1 grow"> 
    <a href = "#/tab1" class = "tooltip"> 
     <img ng-src="{{ imageUrlProfile }}"> 
     <span> 
      <strong>Profile</strong><br /> 
     </span> 
    </a> 
</div>

Controller.js：

application.controller('app', function($rootScope, $scope) { 

     $rootScope.imageUrlProfile = 'images/profile-icon.png'; 
     $rootScope.imageUrlWork = 'images/exp-icon.png'; 
     $rootScope.imageUrlEdu = 'images/edu-icon.png'; 
     $rootScope.imageUrlProject = 'images/project-icon.png'; 
     $rootScope.imageUrlContact = 'images/phone-icon.png'; 

});

來源

2016-03-03 Lalinda Sampath

'所以最初我得到一些控制檯errors'有哪些誤區？張貼 –

@DivyeshSavaliya'無法加載資源：net :: ERR_FILE_NOT_FOUND'我得到這個，因爲頁面最初不知道'imageUrlProfile'值。 –

我還沒有看到在DOM之前加載它的方式，可能你可以通過手動引導選項來實現，並在DOM加載之前進行關聯。但除非確實需要，否則不要推薦它。你可以添加控制檯錯誤和路徑圖像似乎圖像路徑問題？ – Gary

我沒有看到你的代碼中的任何錯誤，除了圖像URL。

$rootScope.imageUrlProfile = 'images/profile-icon.png';

確保以上URL是正確的。 Here is the plunker of your code。在控制檯中顯示以下錯誤消息。

GET https://run.plnkr.co/gi7myGeYUIlWJtxg/images/profile-icon.png 404 (OK)

如果圖像URL是正確的，我認爲它應該工作。

來源

2016-03-03 05:25:05

我的圖像正在加載。但是我得到了控制檯錯誤，因爲它在DOM創建過程中不知道'imageUrlProfile'的值。並且在完成DOM創建後控制器正在執行。以上網址是正確的。 –

我已經更新了搶劫者，請再次檢查。我已經添加了'console.log（$ rootScope.imageUrlProfile）; '在我的plunker中，將此行添加到您的應用程序併發布控制檯輸出。我的plunker使用有效的「URL」正常工作。 –

您是否查看過配置路由以確保在加載控制器之前可用的值？

喜歡的東西下面的代碼片段：

app.module() 
    .config(function ($routeProvider) { 
     $routeProvider 
      .when('/', { 
      templateUrl: 'view', 
      controller: 'ctrl', 
      controllerAs: '$ctrl', 
      resolve: { 
       /// Ensure values exist here 
      }); 
     })

來源

2016-03-03 05:28:31

如何在加載DOM之前運行角度控制器？

回答

相關問題