0

I am a newbie to AngularJs and I am building a simple AngularJs web, I have set up the page and it works as I expect. But when I try to use the rootscope variable in the script part of my index.html. it always give an error: the variable is not define. However, I can still use the variable in the html part of the index.html. Can anyone tell me why it works like this? and how to resolve it? Thanks. Here is my simple HTML Code: 

   <!DOCTYPE html>
<html data-ng-app="test" lang='laCo'>

  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge; IE=10; IE=9">
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <link rel="stylesheet"
    href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

   <script>
     $( function() {
            loaddivpage();
        });
    loaddivpage = function(){
        window.Final = user.userId;
        $( "#innerdiv" ).load("./app/chat/Dialog.html");
    }
   </script>
   </head>
   <body> 
   <div id ="webdiv">
      <div id = "innerdiv"> </div>
   </div>
    </body>
  </html>

Here I want to load a Dialog.html into the innerdiv, which uses the window.Final variable. Note: user.userId is the rootscope variable.

Qi Lin
  • 77
  • 13
  • That's because rootscope is injected into the html, but it might not be injected to the script you are referring to. If you provided a code example we could help you figure out what's the solution... – Yftach Apr 04 '18 at 14:25
  • I have update the question, Thank for answering. – Qi Lin Apr 04 '18 at 14:39
  • 2
    `$rootScope` is not a global service, you need to **inject** it into a controller / run block. Additionally you [shouldn't be using jQuery](https://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-i-have-a-jquery-background). Your solution can be done differently, next time you should be [describing your problem, not a solution](https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem) – Aleksey Solovey Apr 04 '18 at 14:41
  • You have no controller, also you are not actually using $rootScope. – Yftach Apr 04 '18 at 14:41
  • sry I missed some code, I will update it, I have a controller. – Qi Lin Apr 04 '18 at 14:48

1 Answers1

0

I manage to find a way to do, since the html part has connection with the root scope, so I can use angular to fetch the root scope variable: Like: By using angular.element($("#your div id ")).scope() to get scope of the html part, and then use this scope to access the root scope variable. Hope this will help someone else.

Qi Lin
  • 77
  • 13