Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<can-stuff></can-stuff>
<script src="https://unpkg.com/can@5/dist/global/core.js"></script>
<script>
    can.Component.extend({
        tag: "can-el",
        view: "{{stacheStuff}}",
        ViewModel: {
            stacheStuff: {default: "color: blue"},
        }
    });
    // The first {{stacheStuff}} below is expanded only by the "can-stuff"
    // .. ViewModel.  The second one is expanded only by the "can-el" ViewModel.
    // .. Is there a way of forcing both to be expanded from the "can-el" ViewModel
    // .. (so that the Output text "color:blue" shows in blue rather than red)?
    can.Component.extend({
        tag: "can-stuff",
        view: `<br><br><can-el stacheStuff:to="stacheStuff" style="{{stacheStuff}}"></can-el>`,
        ViewModel: {
            stacheStuff: {default: "color: red"},
        }
    });
</script>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers