Clever Geek Handbook

Using the wijmo event calendar with angular

Hell, I'm trying to use the wijmo event calendar with AngularJS liabry, but the assignment binding isn't working correctly. This is my html:

<html>
    <head>
        <title>Control Tests</title>
        <script src="http://code.jquery.com/jquery-1.8.2.min.js" type="text/javascript"></script>
        <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.min.js" type="text/javascript"></script>

        <link href="http://cdn.wijmo.com/themes/rocket/jquery-wijmo.css" rel="stylesheet"
              title="metro-jqueryui" type="text/css" />

        <link href="http://cdn.wijmo.com/jquery.wijmo-pro.all.3.20131.7.min.css" rel="stylesheet" type="text/css" />

        <script src="http://cdn.wijmo.com/jquery.wijmo-open.all.3.20131.7.min.js" type="text/javascript"></script>
        <script src="http://cdn.wijmo.com/jquery.wijmo-pro.all.3.20131.7.min.js" type="text/javascript"></script>
        <script type="text/javascript" src="http://cdn.wijmo.com/external/globalize.min.js"></script>

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
        <script src="http://cdn.wijmo.com/external/angular.wijmo.js" type="text/javascript"></script>

        <script src="../../Scripts/Controller/MainController.js" type="text/javascript"></script>
    </head>
    <body>
        <script>
            $(document).ready(function () {
                $(".wijevcal").wijevcal();
            });
        </script>

        <div ng-app ng-controller="MainController">
            <div class="wijevcal" appointments="{{calAppointments}}"></div>
        </div>
    </body>
</html>

And this is the source of the controller:

function MainController($scope)
{
    $scope.calAppointments = [{
        start: new Date(2013, 5, 23, 15, 30)
    }];
}

Can anyone tell me why the start date doesn't apply to the calendar?

+3


source to share


2 answers


Yes, you need to add the Wijmo module in order to use the custom directives provided by Wijmo.



0


source


I fixed it myself.

I had to call

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


at the beginning of the script and now I can use the tag

<wijevcal></wijevcal>
0


source






More articles:


All Articles