CODEWITHSUNDEEP
pythonangularjs
ramesh
ramesh

Reputation: 1217

AngularJS not working with Flask

I have this simple app:

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>working app</title>
    <script type="text/javascript" src="static/js/angular.min.js"></script>

    <script type="text/javascript">
        angular.module('myApp', [])
            .controller('myCtrl', ['$scope', function($scope) {
                $scope.message = "Howdy!!";
            }])
            .config(['$interpolateProvider', function($interpolateProvider) {
                    $interpolateProvider.startSymbol('{a');
                    $interpolateProvider.endSymbol('a}');
            }]);
    </script>
</head>

<body ng-app="myApp">
<h1>Hello!</h1>
    <div ng-controller="myCtrl">
        <span>{message}</span>
        <span>{{ '{{message}}' }}</span>
    </div>


</body>

I'm getting {message} {{message}} in html page not scope value. I don't have any idea, where I'm going wrong. I really appreciate any sort of help in this!

Upvotes: 0

Views: 821

Answers (1)

Naga Sai A
Naga Sai A

Reputation: 10975

To achieve your expected result, use below option to bind your scope value

{a message a} Start tag and end tag should be '{a' and 'a}' respectively without {{}} inside them

HTML:

<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>working app</title>


    <script type="text/javascript">

    </script>
</head>

<body ng-app="myApp">
<h1>Hello!</h1>
    <div ng-controller="myCtrl">

        <span>{a message a}</span>
    </div>


</body>

JS:

angular.module('myApp', [])
            .controller('myCtrl', ['$scope', function($scope) {
                $scope.message = "Howdy!!";
            }])
            .config(['$interpolateProvider', function($interpolateProvider) {
                    $interpolateProvider.startSymbol('{a');
                    $interpolateProvider.endSymbol('a}');
            }]);

Codepen= http://codepen.io/nagasai/pen/JKrVgV

Upvotes: 3

Related Questions