CODEWITHSUNDEEP
javajavascriptangularjsapplet
fabuloso
fabuloso

Reputation: 206

Binding applet parameters with angularJS

I need to pass a dynamic param to an applet.

This is my controller:

'use strict';

    angular.module('jworkApp')
      .controller('AppletCtrl',['$scope', function (scope) {
              scope.base64 = "abcd";
}]);

This is my view, the parameter base64 is defined in the controller as "abcd"

<p>{{base64}}</p>
<APPLET>
  <PARAM name="text" value={{base64}} />
</APPLET>

When I run my page I see in the p tag the string 'abcd' , but the applet param's value it's simply "{{base64}}".

How could i fix it?

Upvotes: 2

Views: 2682

Answers (2)

fabuloso
fabuloso

Reputation: 206

I solved passing the entire applet declaration. In this way it works correctly.

Controller:

angular.module('jworkApp')
  .controller('AppletCtrl',['$scope', '$sce', function ($scope, $sce) {

            $scope.b64 = 'AAAA';
            $scope.applet = 
                "<APPLET>"+
                "<PARAM name=\"testo\" VALUE=\""+$scope.b64+"\" />"+
                "</APPLET>";

             $scope.getAppletCode = function() {
                  return $sce.trustAsHtml($scope.applet);
             };

  }]);

view:

<div ng-bind-html="getAppletCode()"></div>

Upvotes: 6

Rasteril
Rasteril

Reputation: 615

A working example might be:

<!doctype html>
<html ng-app = "app">
<head>
    <script src = "angular.min.js"> </script>
</head>

<div ng-controller = "Ctrl">
    <p>{{base64}}</p>
    <APPLET>
      <PARAM id = "applet"name="{{base64}}" value="{{base64}}" />
    </APPLET>

    <div id = "debug">

    </div>
</div>

<script>
    var app = angular.module('app', []);
    app.controller('Ctrl', ['$scope', function($scope) {
        $scope.base64 = "base-sixty-four";
    }]);


    //Code to prove, that indeed, the value is what you're looking for     
    var applet = document.getElementById('applet');
    document.getElementById('debug').innerHTML = applet.value;
</script>
</html>

One thing to note: since you can't see the changes on the webpage, the way to view the result is through some kind of Development Tools, such as Chrome Dev Tools, because the value has been changed by angular after the page has been loaded. This means, that simply viewing the source will not show desired results.

Upvotes: 0

Related Questions