如何从控制器javascript传递数据以查看AngularJS中的javascript?

时间:2021-07-10 15:12:30

I am developing an application in angularJS. I get data from a rest service in the controller. And then I pass that data to the view using $scope. In my view, there is an inpage javascript (I know its a bad practice) and I want to used the data passed in my inpage javascript. Simply using the variable name or {{variable_name}} doesnt work. Can any one give any suggestions?

我正在开发angularJS中的应用程序。我从控制器中的休息服务获取数据。然后我使用$ scope将该数据传递给视图。在我看来,有一个inpage javascript(我知道这是一个不好的做法),我想使用我的inpage javascript中传递的数据。简单地使用变量名称或{{variable_name}}不起作用。任何人都可以提出任何建议吗?

Here is my code snipper from controller:

这是我的控制器代码片段:

 $scope.requests = null;

  var url = 'my_url';

    $http.get(url).then(function(response) 
        {
          $scope.requests = response.data;


       if (response.data.status && response.data.message)
         {
            var status = response.data.status + '!'; 
            var message = response.data.message;

             showAlert(status,message);


          }

      return;

        }).catch(function(response) 
        {

          showAlert('danger!','Some error occured. Please try again.');
        });

And here is my inpage javascript code:

这是我的inpage javascript代码:

<script>
$(document).ready(function() { 

    /*
                date store today date.
                d store today date.
                m store current month.
                y store current year.
            */
            var date = new Date();
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();

            /*
                Initialize fullCalendar and store into variable.
                Why in variable?
                Because doing so we can use it inside other function.
                In order to modify its option later.
            */

    $('#calendar').fullCalendar({
        // put your options and callbacks here
             header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
        },
            defaultView: 'month', 
            /*
                    selectable:true will enable user to select datetime slot
                    selectHelper will add helpers for selectable.
                */
            selectable: false,
            selectHelper: false,







                /*
                    editable: true allow user to edit events.
                */
                editable: false,
                /*
                    eventStartEditable: false doesnt allow the dragging of events
                */
                eventStartEditable: false,

                /*
                eventOverlap: false doesnot allow overlapping of events
                */
                eventOverlap: false,
                /*
                    events is the main option for calendar.
                    for demo we have added predefined events in json object.
                */

    /*  var events = requests.map(function(obj, index)
                {
                if (obj.accepted == 'no' ) return false;
                return { id : obj.id, start : obj.start, end : obj.end }
                })*/




}); 
});
</script>

<div id='calendar'></div>

Using {{requests}} prints out the data but it CAN NOT be used within the <script> </script> tags. I want to use it with the script tags

使用{{requests}}打印出数据,但不能在

2 个解决方案

#1


0  

In angular you want to include the $window service in your controller, then set a variable on the $window object. The script tag can then check for window.requestsVariable. You are going have to handle the asynchronous nature of the request though, since the request variable will be empty till the request returns.

在angular中你想在你的控制器中包含$ window服务,然后在$ window对象上设置一个变量。然后,脚本标记可以检查window.requestsVariable。您将不得不处理请求的异步性质,因为请求变量将为空,直到请求返回。

Further, as andrew.butkus pointed out, you probably don't want to do this. The jquery code could be simplified if you moved it into the linking function of an angular directive for the calendar, IMO.

此外,正如andrew.butkus指出的那样,你可能不想这样做。如果将jquery代码移动到日历IMO的角度指令的链接函数中,则可以简化jquery代码。

#2


0  

Declare a global variable as var gloable; outside the controller and inside the controller assign whatever value you want to the declared global variable and then later you can access it inside your Jquery onready function.

将全局变量声明为var gloable;在控制器外部和控制器内部为您声明的全局变量分配您想要的任何值,然后您可以在Jquery onready函数内访问它。

#1


0  

In angular you want to include the $window service in your controller, then set a variable on the $window object. The script tag can then check for window.requestsVariable. You are going have to handle the asynchronous nature of the request though, since the request variable will be empty till the request returns.

在angular中你想在你的控制器中包含$ window服务,然后在$ window对象上设置一个变量。然后,脚本标记可以检查window.requestsVariable。您将不得不处理请求的异步性质,因为请求变量将为空,直到请求返回。

Further, as andrew.butkus pointed out, you probably don't want to do this. The jquery code could be simplified if you moved it into the linking function of an angular directive for the calendar, IMO.

此外,正如andrew.butkus指出的那样,你可能不想这样做。如果将jquery代码移动到日历IMO的角度指令的链接函数中,则可以简化jquery代码。

#2


0  

Declare a global variable as var gloable; outside the controller and inside the controller assign whatever value you want to the declared global variable and then later you can access it inside your Jquery onready function.

将全局变量声明为var gloable;在控制器外部和控制器内部为您声明的全局变量分配您想要的任何值,然后您可以在Jquery onready函数内访问它。