Как назначить угловую установку атрибуту html

У меня есть app.js, который я изменяю и пробовал все под солнцем, чтобы вытащить settings.options.chatURL.value в атрибут html iFrame scr. ближайший я получаю вытаскивает окно предупреждения, но все же говорит {{settings.options.chatURL.value}} ???Как назначить угловую установку атрибуту html

var app=angular.module('settingsGenerator',['colorpicker.module','jdFontselect']).constant('jdFontselectConfig',{googleApiKey:'xxxxxx'}); 
app.controller('SettingsGeneratorCtrl',['$scope', '$window', function($scope, $window){ 
    var Setting=function(type,desc,dflt,required){ 
    this.type=type||"String"; 
    this.desc=desc||"This is a setting that can be changed to a value."; 
    this.required=required||false; 
    this.default=dflt; 
    this.value=dflt; 
    this.toString=function(){ 
     return this.value.toString(); 
    }; 
    }; 
    $scope.products={ 
    'customizable-intro':{ 
     name:'Customizable Intro', 
     settings:{ 
     options:{ 
      backgroundDisplay:new Setting("Radio","Do you want to display a background?","yes",true), 
      backgroundType:new Setting("RadioV","Video or Image Background?","image",true), 
      chatDisplay:new Setting("Radio","Do you want to display a Chat Box?","yes",true), 
      chatURL:new Setting("String","Chat Box URL (stream labs)","http://example",false) 
     } 
     } 
    } 
    } 
}]);

<html> 
    <div id="chat"> 
     <iframe id="twitchChat" src="*({{NEED URL HERE}})*"> 
     </iframe> 
     <span id="chatURL">{{settings.options.chatURL.value}}</span> 
    </div> 
</html>

источник

2017-02-08 Anthony Lester

у вас есть угловой в вашей HTML странице? – MMK

Вы должны поместить директивы в ng-app и ng-controller на одном из этих DOM элементов для того, чтобы угловой иметь объем над той частью DOM, как так:

После того как вы получить угловое значение, вам нужно будет получить доступ к вашему объекту, на который, похоже, не хватает нескольких слоев, основанных на вашем коде. Вы получаете доступ к $scope.settings.options.chatURL.value, и это должно быть $scope.products['customizable-intro'].settings... Вы можете использовать полное пространство имен каждый раз или просто использовать директиву ng-init, чтобы сократить ее.

Кроме того, попытка использования угловой интерполяции с равным src атрибутом была задокументирована, чтобы не работать последовательно, и в соответствии с угловыми документами они рекомендуют использовать ng-src. Docs Here

<html ng-app="settingsGenerator"> 
    <div id="chat" ng-controller="SettingsGeneratorCtrl" 
     ng-init="settings = products['customizable-intro'].settings"> 
     <iframe id="twitchChat" ng-src="{{settings.options.chatURL.value}}"></iframe> 
     <span id="chatURL">{{settings.options.chatURL.value}}</span> 
    </div> 
</html>

источник

2017-02-08 22:25:29 mhodges

[http://friendlyneighborhoodgeeks.com/twitch/overlays/settings-generator.html](website) Я попробовал это, добавив в ng-контроллер и init все еще ничего –

@ AnthonyLester «все еще ничего» мне не помогает. Что конкретно происходит при запуске этого кода? Что не работает? Вы получаете сообщения об ошибках? Правильный ли URL отображается в диапазоне chatURL? – mhodges

Атрибут src могут быть добавлены динамически к элементу. Функция setting должна возвращать значение, чтобы установить его на ключи объекта. См. Приведенный ниже код.

var app = angular.module('settingsGenerator',[]); 
 
app.controller('SettingsGeneratorCtrl', function($scope){ 
 
$scope.Setting = function(type,desc,dflt,required){ 
 
return { 
 
    type: type||"String", 
 
    desc: desc||"This is a setting that can be changed to a value.", 
 
    required: required||false, 
 
    default: dflt, 
 
    value: dflt 
 
    } 
 
} 
 
$scope.products = { 
 
    'customizable-intro': { 
 
    name:'Customizable Intro', 
 
    settings: { 
 
     options: { 
 
     backgroundDisplay: $scope.Setting("Radio","Do you want to display a background?","yes",true), 
 
     backgroundType: $scope.Setting("RadioV","Video or Image Background?","image",true), 
 
     chatDisplay: $scope.Setting("Radio","Do you want to display a Chat Box?","yes",true), 
 
     chatURL: $scope.Setting("String","Chat Box URL (stream labs)","https://www.google.com",false) 
 
     }}}} 
 

 
$scope.al = function(){ angular.element(document.getElementById('twitchChat')).attr('src', 'http:/www.example.com') 
 
} 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div id="chat" ng-app="settingsGenerator" ng-controller="SettingsGeneratorCtrl"> 
 
    <button ng-click="al()">button</button> 
 
     <iframe id="twitchChat"> 
 
     </iframe> 
 
     <span id="chatURL">{{products['customizable-intro'].settings.options.chatURL.value}}</span> 
 
    </div>

источник

2017-02-09 12:54:32

Как назначить угловую установку атрибуту html

ответ

Смежные вопросы