elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Usando Git para manipular el directorio de trabajo, el índice y commits (segunda parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Problemita con AngularJS HTML5 (RESUELTO)
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Problemita con AngularJS HTML5 (RESUELTO)  (Leído 9,115 veces)
Man-In-the-Middle
Colaborador
***
Desconectado Desconectado

Mensajes: 3.836



Ver Perfil
Problemita con AngularJS HTML5 (RESUELTO)
« en: 10 Abril 2014, 17:05 pm »

Juasss a los años que no me paso por aqui!

Holas,  aver si alguien me da un cable , que ya me duele la cabeza y no es mi área esta parte y la verdad me tiene sin dormir XD,.

Cuento con 2 files, un index.html  y un items.html,    desde el index.html se carga items.html, el problema es que cuando le meto un script al items.html, no me los muestra, en el index.html

Index.html
Código:
<!DOCTYPE html>
<html data-ng-app="ngApp">
<head>
<script src="https://jwpsrv.com/library/+SIITL5fEeO4_CIACmOLpg.js"></script>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
<link rel="stylesheet" href="css/main.css">
<link href='https://fonts.googleapis.com/css?family=Duru+Sans|Istok+Web' rel='stylesheet' type='text/css'><link rel="stylesheet" href="css/bootstrap-theme.min.css">
</head>
<body data-ng-controller="main" >
    <div class="navbar navbar-default navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#"><img ng-src="{{sitelogo}}"/><span ng-bind="sitename"></span></a>
        </div>
        <div class="navbar-collapse collapse" style="position:relative">
<div class="simplecart_div">
<span class="showCart"><i class="fa fa-shopping-cart"></i> <span class="simpleCart_quantity"></span> items - <span class="simpleCart_total"></span> <i class="dropdown fa fa-chevron-circle-down"></i> &nbsp;&nbsp;</span>
<button class="simpleCart_checkout btn btn-xs btn-primary">Checkout</button>
</div>
<div id="cartPopover" style="display:none">
<div class="simpleCart_items"></div>
</div>

        </div><!--/.navbar-collapse -->
      </div>
    </div>
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
<div id="content">
<h1 class="page_title" ng-bind="pagetitle"></h1>
<div style="margin-bottom:20px" class="page_description" ng-bind="pagedescription"></div>
<div class="loading"><i style="vertical-align:middle;color:#888;font-size:30px" class="fa fa-cog fa-spin"></i> loading...</div>
   <div style="display:none" ng-cloak class="ng-cloak" data-ng-view=""></div>
</div>
</div>
        </div>
      <hr>








      <footer>
        <p><span ng-bind-template="&copy; {{sitename}} 2014 | Contact me at {{siteemail}} | "></span>Powered by <a href='http://canvasnow.com'>PayPal Instant Store Cart</a></p>
      </footer>
    </div>
    
<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
<script src="js/vendor/jquery-1.10.1.min.js"></script>
    <script src="js/vendor/angular.js"></script>
   <script src="js/vendor/angular-resource.min.js"></script>
<script src="js/vendor/angular-route.min.js"></script>
    <script src="js/vendor/bootstrap.min.js"></script>
<script src="js/vendor/tabletop.js"></script>
<script src="js/vendor/jquery.grid-a-licious.min.js"></script>
    <script src="js/simpleCart.min.js"></script>
<script src="js/app.js"></script>

<script id='script'>

// MUST CHANGE THIS URL TO YOUR OWN "PUBLISHED" GOOGLE DOC URL
public_spreadsheet_url = "https://docs.google.com/a/thelastart.com/spreadsheet/pub?key=0As7ueB-BviwSdHZjcnIybVhSWmgtdzQzd1BqTUdkbUE&output=html";
sheet = "Sheet1";  // NORMALLY called Sheet1 on default Google Docs spreadsheet

$(document).ready(function() {
$('.showCart').on('click',function() {
$('#cartPopover').slideToggle('fast');
$('.showCart i.dropdown').toggleClass('fa-chevron-circle-down fa-chevron-circle-up');
})
});

    </script>
    </body>
</html>


Items.html


Código:
<div data-ng-template="table" class="items">

<div class="simpleCart_shelfItem item" data-ng-repeat="item in items" size-column>

<div class="item_image"><img ng-src="{{ item.imagelink }}"/></div>
  <h2 class="item_name" ng-bind="item.name"></h2>
        <h1 class="item_prueba" ng-bind="item.prueba"></h1>
<div class="item_description" ng-bind="item.description"></div>
      
               <div id='playerPyVnYFeEBoif'>
<script type='text/javascript'>
    jwplayer('playerPyVnYFeEBoif').setup({
        file: '/vod/mp4:/7/7/2/6/5/5/2556277.mp4',
        image: 'http://www.longtailvideo.com/content/images/jw-player/lWMJeVvV-876.jpg',
        width: '100%',
        aspectratio: '16:9'
    });
</script></div>


Hola
<div style="margin-top:10px;">
  <button class="item_add btn btn-xs btn-success">Launch Movie</button>
  <span class="item_price"> ${{item.price}}</span>
</div>
<div class="clearfix"></div>
</div>

</div>


Se que es una burrada, pero no entiendo donde esta la falla y como podría solucionarlo?,  

Esto es lo que no me carga, ni  siquiera un Hola mundo, lanzado de script?
Código:
<script type='text/javascript'>
    jwplayer('playerPyVnYFeEBoif').setup({
        file: '/vod/mp4:/7/7/2/6/5/5/2556277.mp4',
        image: 'http://www.longtailvideo.com/content/images/jw-player/lWMJeVvV-876.jpg',
        width: '100%',
        aspectratio: '16:9'
    });
</script></div>


« Última modificación: 11 Abril 2014, 23:33 pm por Man-In-the-Middle » En línea

https://www.latotatv.com
Código:
La Tota TV
EFEX


Desconectado Desconectado

Mensajes: 1.171


"Dinero Facil"


Ver Perfil WWW
Re: Problemita con HTML5
« Respuesta #1 en: 11 Abril 2014, 00:13 am »

Como cargas items.html ?

Edit: Bueno seguro con AngularJS, leyendo por hay parece que no es posible cargar scripts en las vistas, por lo que tenes que agregarlo en el index..
https://stackoverflow.com/questions/12436679/how-to-include-javascript-file-specific-to-each-view-angularjs

Edit: Si intento este codigo no funciona.. voy a verlo despues a ver que se puede hacer  ::)(sino para que alguien mas lo mire y opine)

index.html
Código
  1. <!doctype html>
  2. <html data-ng-app="prueba">
  3. <meta charset="utf-8"/>
  4. <head>
  5. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
  6. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular-route.js"></script>
  7. <script type="text/javascript">
  8. var probando = angular.module("prueba", ['ngRoute']);
  9.  
  10. probando.config(function($routeProvider) {
  11. $routeProvider
  12. .when('/',
  13. {
  14. controller:'ListCtrl',
  15. templateUrl:'items.html'
  16. })
  17. .otherwise({redirectTo:'/'});
  18. });
  19.  
  20. probando.controller('ListCtrl', function($scope) {
  21.    //$scope.message = '...';
  22. });
  23. </head>
  24. <body>
  25. <h2>Prueba</h2>
  26. <div data-ng-view="">Vista aqui..</div>
  27. </body>
  28. </html>

items.html
Código
  1. <h1>Items</h1>
  2. <p>Cargado <i>items.html</i></p>
  3. <script type="text/javascript">
  4. alert('Hola!');


« Última modificación: 11 Abril 2014, 02:54 am por EFEX » En línea

Man-In-the-Middle
Colaborador
***
Desconectado Desconectado

Mensajes: 3.836



Ver Perfil
Re: Problemita con HTML5
« Respuesta #2 en: 11 Abril 2014, 03:44 am »

Gracias Tio!, le voy a meter una checa al tema!! ya decia , pero algo es curioso,  al momento que corro el index.html(el mio) y despues de hacer una accion(como descargar una imagen), aparece , lo cual me hace pensar que si llega a cargar el script como en cache , adjunto pic

En línea

https://www.latotatv.com
Código:
La Tota TV
EFEX


Desconectado Desconectado

Mensajes: 1.171


"Dinero Facil"


Ver Perfil WWW
Re: Problemita con HTML5
« Respuesta #3 en: 11 Abril 2014, 03:47 am »

Bueno pude hacerlo siguiendo esta respuesta..
https://stackoverflow.com/questions/19434249/angular-js-how-to-load-js-files-in-partials

Fijate si podes implementarlo a tu script sino pregunta, asi es como quedo..

index.html
Código
  1. <!doctype html>
  2. <html data-ng-app="prueba">
  3. <meta charset="utf-8"/>
  4. <head>
  5. <script type="text/javascript" src="http://127.0.0.1/assets/js/jquery-1.8.2.js"></script>
  6. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
  7. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular-route.js"></script>
  8. <script type="text/javascript">
  9. var probando = angular.module("prueba", ['ngRoute']);
  10.  
  11. probando.config(['$routeProvider', '$controllerProvider',
  12. function($routeProvider, $controllerProvider) {
  13.  
  14. probando.registerCtrl = $controllerProvider.register;
  15.  
  16. $routeProvider
  17. .when('/',
  18. {
  19. //controller:'ListCtrl',
  20. templateUrl:'items.html'
  21. })
  22. .otherwise({redirectTo:'/'});
  23. }
  24. ]);
  25. /*
  26. probando.controller('ListCtrl', function($scope) {
  27.    //$scope.message = '...';
  28. });
  29. */
  30. </head>
  31. <body>
  32. <h2>Prueba</h2>
  33. <div data-ng-view="">Vista aqui..</div>
  34. </body>
  35. </html>
  36.  

items.html
Código
  1. <h1>Items</h1>
  2. <p>Cargado <i>items.html</i></p>
  3. <script type="text/javascript" src="proccessItems.js"></script>
  4. <div data-ng-controller="proccessItems">
  5.    {{content}}
  6. </div>

proccessItems.js
Código
  1. alert('fkyeah');
  2.  
  3. probando.registerCtrl('proccessItems', function($scope){
  4. $scope.content = '...';
  5. });

Saludos

edit: Fijate que agrege la libreria JQuery, mas bien esto es un hack  :), puede que no funcione con alguna version previa de AngularJS, pero con la v1.2.10 funciona,. sino agrega los otros script y vemos.

pero algo es curioso,  al momento que corro el index.html(el mio) y despues de hacer una accion(como descargar una imagen), aparece , lo cual me hace pensar que si llega a cargar el script como en cache , adjunto pic

Mm si le das play reproduce el video?
« Última modificación: 11 Abril 2014, 07:08 am por EFEX » En línea

Man-In-the-Middle
Colaborador
***
Desconectado Desconectado

Mensajes: 3.836



Ver Perfil
Re: Problemita con HTML5
« Respuesta #4 en: 11 Abril 2014, 21:17 pm »

Hi , gracias de nuevo,  con respecto a esto  
Citar
Mm si le das play reproduce el video?
si corre el video pero tengo que hacer una acción y solo levanta en una sola tabla, lo cual desde ya me limita, ahorita subo un video del demo, por otro lado he corrido tu source, pero solo llega  hasta Prueba, no me carga el items.html, tienes algun link para ejecutar y ver donde esta mi error?
Nuevamente Grax por tu tiempo, me estas evitando un puteada el fin de semana XD!!

« Última modificación: 11 Abril 2014, 21:31 pm por Man-In-the-Middle » En línea

https://www.latotatv.com
Código:
La Tota TV
EFEX


Desconectado Desconectado

Mensajes: 1.171


"Dinero Facil"


Ver Perfil WWW
Re: Problemita con HTML5
« Respuesta #5 en: 11 Abril 2014, 21:54 pm »

... por otro lado he corrido tu source, pero solo llega  hasta Prueba, no me carga el items.html, tienes algun link para ejecutar y ver donde esta mi error?

Seguro lo probaste en un servidor local ?
http://web-45e48295-8513-4f83-b91d-b74bf3e19258.runnable.com/#/
http://runnable.com/U0hHt7_lhxISJ3cH/angularjs-run-script-in-view-for-jquery-javascript-and-angular-js
« Última modificación: 11 Abril 2014, 22:01 pm por EFEX » En línea

Man-In-the-Middle
Colaborador
***
Desconectado Desconectado

Mensajes: 3.836



Ver Perfil
Re: Problemita con HTML5
« Respuesta #6 en: 11 Abril 2014, 22:30 pm »

Código:
Esta página incluye contenido no seguro!!
Graxias Chrome jaja!!, pues corre, y corre bien sin ningún problema, muchas gracias brother de verdad, vas a hacer el primer usuario de esta pagina de Streaming media  completamente FREEEEE! FKyea!  ;-)



Gracias Nuevamente!!
MITM
En línea

https://www.latotatv.com
Código:
La Tota TV
EFEX


Desconectado Desconectado

Mensajes: 1.171


"Dinero Facil"


Ver Perfil WWW
Re: Problemita con HTML5 (RESUELTO)
« Respuesta #7 en: 11 Abril 2014, 22:44 pm »

Lo de jwplayer creo que lo reproduce por que tenes la libreria js cargada en el index.
En línea

Man-In-the-Middle
Colaborador
***
Desconectado Desconectado

Mensajes: 3.836



Ver Perfil
Re: Problemita con HTML5 (RESUELTO)
« Respuesta #8 en: 11 Abril 2014, 23:30 pm »

Citar
  pero eso solo la libreria, la ruta del mp4 esta en el items, eso quiere decir que si lo carga, pero es un glitch por que FF no funciona, vistes el video? que te mande por privado, yo le cambio la ruta al video en items.html y me carga ese video,  ahora si yo hago una actualizacion nuevamente se borra de nuevo
En línea

https://www.latotatv.com
Código:
La Tota TV
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
guia de angularjs
Desarrollo Web
landerzx 2 2,933 Último mensaje 19 Agosto 2013, 21:22 pm
por landerzx
autocomplete con angularjs
Desarrollo Web
landerzx 0 1,696 Último mensaje 19 Agosto 2013, 20:55 pm
por landerzx
¿Cuáles son las ventajas de jQuery sobre AngularJS?
Desarrollo Web
lnvisible 6 7,261 Último mensaje 23 Enero 2014, 20:45 pm
por maikmilk
[Resuelto] Seguridad y vulnerabilidades en html5 y jade
Desarrollo Web
Ali Baba 4 2,947 Último mensaje 5 Enero 2017, 17:16 pm
por Ali Baba
Consulta AngularJs(cambiar valores dinamicamente directiva ng-repeat) [resuelto]
Desarrollo Web
Razzari 0 2,438 Último mensaje 24 Febrero 2017, 21:12 pm
por Razzari
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines